.custom_area {
 padding: 0px 0px 30px;
 margin:30px 0 0px;
}

.custom_area .color_line {
 font-size:20px;
 display: block;
 margin: 0px 0px 15px;
}

.price_cmp {
 padding:20px 0 5px;
}

.custom_area_fig {
	margin: 0px 15px 15px;

}

#submit_button_area {
	background-image: url(../img/ye_down_arrow.png);
	background-repeat: no-repeat;
	background-position: center top;
	background-size:30px 12px;
	padding-top:20px;
}

.custom_area h3 {
 text-align:left;
 background-color: #F4F4F4;
 border-top: 1px solid #DADADA;
 border-bottom: 1px solid #DADADA;
 padding: 10px 15px 12px;
}

.custom_area h3 span {
 color:#5CB531;
}

.custom_area_fig p {
	position:relative;
	margin-bottom:0;
}

.form_page .custom_area_fig p {
 text-align:center;
}


.custom_area_fig select {
 padding:5px;
 border-radius:5px;
 border: 1px solid #CCC;
 box-sizing:border-box;
 float:right;
 margin-right:5px;
}


p#number span.unit { margin-right:1.5em;}

p#period span.unit { margin-right:0.5em;}

span.unit {
 float:right;
 text-align:left;
}

.help {
 display:inline-block;
 position:absolute;
 top:15px;
 right:5px;
 width:16px;
}

.note {
 font-size:90%;
 font-weight:normal;
}

/*.custom_area_fig label {
 display:block;
 text-align:right;
 padding:5px 0;
}*/

.custom_area_fig p.coupon {
 text-align:center;
 padding:10px;
 border-top: 1px solid #DADADA;
}

.coupon a {
 display:inline-block;
 padding:10px;
 border-radius:10px;
 background-color:#F29100;
 color:#FFF;
 font-weight:bold;
}

.coupon button {
 display:inline-block;
 padding: 8px;
 margin: 0;
 border-radius:5px;
 background-color:#F29100;
 color:#FFF;
 font-weight:bold;
 text-decoration:none;
 border: none;
}
.coupon .overbu {
 cursor: pointer;
}

.coupon a:link,
.coupon a:visited,
.coupon a:hover,
.coupon a:active {
 text-decoration:none;
}

.coupon .done {
 opacity: 0.8;
 cursor:default;
}



.custom_area_result {
 background-color:#FFFDDD;
 padding:10px;
 margin-bottom:20px;
}

table.breakdown,
table.total {
	border-left: 1px solid #E6E6E6;
	margin-bottom:0;
}

table.breakdown {
	border-top: 1px solid #E6E6E6;
}


table.breakdown th,
table.breakdown td,
table.total th,
table.total td {
	border-right: 1px solid #E6E6E6;
	border-bottom: 1px solid #E6E6E6;
}

table.breakdown th,
table.total th {
	font-size:18px;
	padding:3px 30px;
}

table.breakdown td,
table.total td {
	padding:0px;
}


table.breakdown th {
	background-color:#F5F5F5;
}

table.total th {
	background-color:#FFE663;
}

table.breakdown ul {
	margin-top:0;
}

table.breakdown li {
	margin-bottom:0;
	border-bottom: 1px solid #E6E6E6;
	padding:3px 30px;
}

table.breakdown li p{
	width:48%;
	float:left;
}

table.breakdown li p:last-of-type{
	float:right;
	text-align:right;
}

table.total td {
	text-align:right;
	padding-right:30px;
}


.form_page .custom_area_result {
 margin-bottom:0px;
}

.custom_area_result p {
 margin-bottom:5px;
	font-size:14px;
 text-align:left;
}

.custom_area_result .total {
 font-size:20px;
 line-height:1.2;
}

.custom_area_result .total span {
 color:#E60012;
}

.custom_area_result .total span.price {
 font-size:36px;
 font-weight:bold;
}

.custom_area_result ul#submit_button_area {
 margin-top:10px;
}

.custom_area_result li {
 margin-bottom:10px;
}

@media screen and ( max-width : 599px ) {

.custom_area.form_page {
 padding-top:20px;
}

input[type="image"] {
  width: 100%;
	height:auto;
}


.custom_area_fig .blk select{
 float:none;
 margin-right:5px;
}

table.breakdown th,
table.breakdown td,
table.total th,
table.total td {
	display:block;
}
}


.toolTip{
	position: relative;
}

.toolTip span{
	display: block;
	border: solid 3px #dadada;
	background-color: #FFF;
	color: #000;
	text-decoration: none;
	position: absolute;
	top: 25px;
	left: 0px;
	padding: 15px;
	visibility: hidden;
	width: 270px;
 font-size:14px;
}

.custom_area_fig .toolTip span{
	top: 16px;
	right: 0px;
	left: auto;
}


a.toolTip:hover,
a.toolTip:hover span{
	visibility: visible;
	z-index: 100;
}


button {
    font-size: 16px;
    margin: 0px 10px;
    padding: 10px;
}



/* pc css start --------------------------------------------------*/
@media screen and ( min-width : 600px ) {

.custom_area_bg {
 padding: 50px 0px 30px;
 background-color: #FFF;
}

.custom_area  {
 width:800px;
 box-sizing:border-box;
 margin:50px auto;
 padding:45px;
 background-color:#FFF;
 border: 3px solid #DDD;
}

.custom_area.form_page {
 margin-bottom:15px;
}

.custom_area_fig {
	background-size:60px 24px;
	padding-bottom:20px;
}

#submit_button_area {
	background-size:60px 24px;
	padding-top:40px;
}

.form_page .custom_area_fig p {
 text-align:center;
 padding:10px;
 box-sizing:border-box;
 width:540px;
	border-top: 1px solid #DADADA;
 margin:auto;
}

.custom_area_fig select{
 font-size:17px;
}


.price_cmp p.campaign {
 margin: 20px 0px 30px;
}

.custom_area .color_line {
 width:540px;
 font-size:32px;
 margin: 0px auto 15px;
}

.custom_area_fig form {
 width:540px;
 margin: 0px auto 15px;
}

.custom_area h3 {
 padding: 10px 0px 12px 0px;
 font-size:18px;
}

.custom_area h3 span {
 font-size:16px;
 display:inline-block;
 width:100px;
}


.custom_area_fig p {
 font-size:18px;
}

.note {
	font-size:14px;
 display:block;
 margin-top:5px;
}


.help {
 top:25px;
}


.custom_area_fig p.coupon label{
 text-align:right;
 font-size:16px;
}

.coupon a {
 padding:3px 8px;
 border-radius:5px;
 font-size:16px;
}



ul#submit_button_area {
 margin: 20px auto 0px;
 width: 600px;
}

#submit_button_area li {
 float:left;
 width:290px;
}

.custom_area_result {
	padding:30px;
}

.custom_area_result li#cart_url {
 margin-right:20px;
}

.custom_area_result li input[type="image"] {
 width:290px;
}

#content>div:last-of-type {
 margin-bottom:50px;
}



table.breakdown,
table.total {
	border-top: 1px solid #E6E6E6;
	border-left: 1px solid #E6E6E6;
	width:470px;
	box-sizing:border-box;
}

table.total {
	border-top: none;
}

table.breakdown th,
table.breakdown td,
table.total th,
table.total td {
	border-right: 1px solid #E6E6E6;
	border-bottom: 1px solid #E6E6E6;
}

table.breakdown th,
table.total th {
	width:150px;
	box-sizing:border-box;
	padding:3px 10px;
}



table.breakdown ul {
	margin-top:0;
}

table.breakdown li {
	margin-bottom:0;
	padding:3px 10px 0;
}

table.breakdown li p{
	width:140px;
	float:left;
	font-size:18px;
}

table.total td {
	padding-right:10px;
}

.custom_area_result p.custom_area_notice {
	width:470px;
	margin:auto;
}



}