@charset "UTF-8";

/*  color
$textcolor:#333333;
$yubin:#cc0000;
$yubin2:#FAECEA;
$bg:#eeeeee;
$border:#c9c9c9;
$yucho:#009900;
$kanpo:#000099;
$int:#FA812F;

$gray1:#646464;
$gray2:#a0a0a0;
$gray3:#c8c8c8;
$gray4:#dcdcdc;
$gray5:#eeeeee;
$gray6:#f7f7f7;
$gray7:#FAFAFA;
*/

/* fee
----------------------------------------------- */
p.s{font-size:80%;}
ul.postin{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: center;
}
	ul.postin li{padding:10px 15px;border-right:1px dashed #c8c8c8;}
	ul.postin li:last-child{border-right:0;}

div.box.bl1 + div.box.bl1{border-top:0;}

/*
/send/fee/simulator/index
----------------------------------------------- */
.linkbox2_borderR{}
	.linkbox2_borderR dl dd{padding:10px 10px 0;}

@media screen and (max-width: 750px){
.linkbox2_borderR dl dt{ width: 20%;}
.linkbox2_borderR > div:nth-child(n + 2), .linkbox2_borderR > a.box:nth-child(n + 2){ margin-top: 10px;}
}

/*
/send/fee/kokunai/option.html
----------------------------------------------- */



/*
/send/fee/kokunai/parcel.html
----------------------------------------------- */
/*youpack ryokin*/

#feeArea{
	position:relative;
	height:650px;
}
#feeArea:after{
	display:block;
	content:"";
}

div.feeObject{
	position:absolute;
	width:800px;
	right:-10px;
	bottom:0px;
	z-index:0;
}
div.feeObject a:hover{
	opacity:0.75;
}

div.feeObject svg{
	height: 100%;
	width: 100%;
}

.collapsible2{
	position:absolute;
	left:0;
	top:0;
	width: calc(100% - 300px);
	z-index:1;
}
.collapsible2 div.areaBox{
	box-sizing:border-box;
	border:1px solid rgba(204,204,204,1);
	border-radius:5px;
	width:29%;
	height:100px;
	display:inline-block;
	vertical-align:top;
	padding:10px;
	margin-bottom:5px;
}



.collapsible2 div.areaBox ul.list li{
		display:inline-block;
	}

#feeArea .collapsible2 div.areaBox ul.list.en{
	margin-top:0;
	font-size:14px;
	}


	.collapsible2 div.areaBox h3{
		padding:0;
		margin:0;
		border-left:none !important;
	}
	
	.collapsible2 div.areaBox ul.list li{
		display:inline;
	}
	.collapsible2 div.areaBox:nth-of-type(1){
		border-left:5px solid #cfa7cd;
	}
	.collapsible2 div.areaBox:nth-of-type(2){
		border-left:5px solid #f9c270;
	}
	.collapsible2 div.areaBox:nth-of-type(3){
		border-left:5px solid #addef8;
	}
	.collapsible2 div.areaBox:nth-of-type(4){
		border-left:5px solid #4090f3;
	}
	.collapsible2 div.areaBox:nth-of-type(5){
		border-left:5px solid #e07961;
	}
	.collapsible2 div.areaBox:nth-of-type(6){
		border-left:5px solid #59bc88;
	}
	.collapsible2 div.areaBox:nth-of-type(7){
		border-left:5px solid #b6d56a;
	}
	.collapsible2 div.areaBox:nth-of-type(8){
		border-left:5px solid #f4b4d0;
	}
	.collapsible2 div.areaBox:nth-of-type(9){
		border-left:5px solid #ffed61;
	}
	.collapsible2 div.areaBox:nth-of-type(10){
		border-left:5px solid #aea1ef;
	}
	.collapsible2 div.areaBox:nth-of-type(11){
		border-left:5px solid #a3d6ca;
	}
	.collapsible2 div.areaBox:nth-of-type(12){
		border-left:5px solid #addef8;
	}
@media screen and (min-width:751px) and ( max-width:1366px) {
	div.feeObject{position:relative;}
	.collapsible2{position:relative;padding-right:0;}
	.collapsible2 div.areaBox{height:auto;}
	#feeArea{height:auto; display:flex; flex-wrap:wrap;}
	#feeArea .feeObject{flex-basis:100%; max-width:100%; order:2;}
	#feeArea .collapsible2{flex-basis:100%; max-width:100%; order:1;}
} /* yubi#feeAreanpc */

@media screen and (max-width: 750px){
	#feeArea{height:auto;}
.parcel #feeArea .feeObject{
	height:65vw;
	position: static;
	width:100%; right:auto;bottom:auto;
}
.parcel .collapsible2{position:static; width:100%;padding-right:0;}
.parcel .collapsible2 div.areaBox h3{
	border-top:1px solid #ce0000;
	border-left:0 !important;
}
.collapsible2 div.areaBox{width:100%; height:auto; border:none; border-left:none !important; padding:0; margin-bottom:0;}
.parcel .collapsible2 div.areaBox:nth-of-type(1) h3{
	border-top:none;
}
.parcel .collapsible2 div.areaBox ul.list li{
	border-top:1px dotted #ce0000;
}
.parcel .collapsible2 div.areaBox ul.list:nth-of-type(1){
	border-top:none;
}
.parcel .collapsible2 div.areaBox .list{
	padding:0px 0;
}

.parcel .collapsible2 .list:before{
		display:none;
		height:0 !important;
		overflow:hidden !important;
	}
.parcel .collapsible2 .list:after{
		display:none;
		height:0 !important;
		overflow:hidden !important;
	}

.parcel #feeArea .feeObject svg{
	width:100%;
	height:auto !important;
}
}/* sp */

.iconmsg.noborder {
    border: none !important;
    padding: 0 ;
}
p.msgSub{
    display: block !important;
    font-weight:lighter !important;
    margin-left: 65px;
    margin-top: -10px;
}
@media screen and (max-width: 750px) {

}/*end*/