@charset "utf-8";


span.dl a{
	display:block;
	line-height:47px;
	float:left;
	text-decoration:none;
	padding:0;
	border:1px solid #bf0d0d;
	color:#333;
	font-size:0.85rem;
	background:#fff;
	background-size:12px 12px;
	width:190px;
	text-align:center;
	margin-left: 5px;
}

span.dl a img{
	width:30px;
	height:auto;
	vertical-align:-8px;
	margin-right:2px;
}

span.dl a:hover{
	color:#bf0d0d;
}
dl.code dd div{
	display:table;
}

dl.code dd{
	display:table;
}

span.code{
	font-size:0.9rem;
	padding:4px 4px 4px 30px;
	text-align:center;
	display:table-cell;
	line-height:1.3rem;
	white-space: nowrap;
}

span.code01,
span.code02,
span.code03{
	display:block;
	float:left;
	padding:4px 13px;
	margin-right:10px;
	margin-bottom:20px;
}

span.code01{
	background:#ecd9d1;
	border:1px solid #d96d3e;
}

span.code02{
	background:#e2e9d4;
	border:1px solid #88ad37;
}

span.code03{
	background:#dbe5f1;
	border:1px solid #4085e2;
}

.box{
	clear:both;
	background:#fff;
	border:1px solid #ccc;
	padding:20px;
	margin-bottom:15px;
}

.box h3{
	padding:0 0 15px;
	line-height:190%;
	padding:0;
	font-size:1.2rem;
	font-weight:bold;
	clear:both;
}

.box h3 span{
	padding:0;
	display:block;
}

.box span.code01,
.box span.code02,
.box span.code03{
	display:block;
	padding:4px 5px;
	margin-right:0;
	margin-left:10px;
	margin-bottom:0;
	font-size:0.85rem;
	float:left;
}

.box dl dt{
	width:40%;
	font-size:0.9rem;
	vertical-align:middle;
}

.box dl dd{
	width:60%;
	display:table-cell;
	text-align:right;
	vertical-align:middle;
	float:right;
}

.box dl.code{
	width:95%;
	display:table;
	margin-left:5%;
}

#yb dl.code{
	width:100%;
	display:table;
	margin-left:0;
}

hr.code{
   border: dotted #ddd;
   border-width: 1px 0 0 0;
   width:95%;
   margin-left:5%;
   clear:both;
   height: 1px;/* for IE6 */
   clear: both;/* for IE6 */
}

.box dl.code dt{
	width:50%;
	display:table-cell;
}

.box dl.code dd{
	width:50%;
	text-align:right;
	display:table-cell;
}

.box dl dd div{
	float:right;
}

.box dl dd div span{
	display:table-cell;
	vertical-align:middle;
}

.prescribe_list ul{
	overflow:hidden;
	margin-top:15px;
    display:-webkit-box;
    display:-moz-box;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
}

.prescribe_list li{
	width:49%;
	margin-bottom:2%;
	border:1px solid #ccc;
	background: #fff;
	padding:10px 10px 2rem 10px;
	box-sizing: border-box;
	margin-bottom:20px;
	position: relative;
	float: left;
}

.prescribe_list li div.img{
	position:relative;
	text-align:center;
	width:120px;
	padding-right:10px;
}

.prescribe_list li div.img img.icon{
	height:auto;
	position:absolute;
	bottom:-3px;
	right:-3px;
	border:none;
}

.prescribe_list li div.img a{
	position:relative;
	display:block;
	margin-right:20px;
}
.prescribe_list li div.img img {
	max-width: 80px;
}

.prescribe_list li div{
	display:table-cell;
	vertical-align:top;
	line-height:1.5;
}

.prescribe_list li div p{
	padding-top:5px;
}
.prescribe_list li div span {
    	position: absolute;
	right: 1rem;
	bottom: 0.5rem;
	font-size: 0.8rem;
	line-height: 1.4;
}
.prescribe_list li div p a {
	display:block;
	height:30px;
	width: 75px;
}
.prescribe_list li div p a img{
	height:30px;
	margin-top:5px;

}

.prescribe_list li div p a img:hover{
	opacity:0.7;
}

.prescribe_list li:nth-child(2n){
	margin-left:2%;
}

.prescribe_list li:nth-child(2n+1){
	clear:both;
}

div.code{
	overflow:hidden;
}

.code_download ul{
	overflow:hidden;
}

.code_download li{
	float:left;
	width:49%;
	background: #fff;
	padding:10px;
	display:table;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}

.code_download li label{
	cursor:pointer;
}

.code_download li label input{
	margin-right:10px;
}

.code_download li div.img{
	width:115px;
	position:relative;
	text-align:center;
}

.code_download li div.img img{
	border:1px solid #eee;
	height:130px;
}

.code_download li div.img img.icon{
	height:auto;
	position:absolute;
	bottom:-3px;
	right:-3px;
	border:none;
}

.code_download li div.img a{
	position:relative;
	display:block;
	margin-right:20px;
}

.code_download li div{
	display:table-cell;
	vertical-align:top;
}

.code_download li div p{
	font-size:0.85rem;
	line-height:1.3rem;
	padding-top:5px;
}

.code_download li:nth-child(2n){
	margin-left:2%;
}

.code_download li:nth-child(2n+1){
	clear:both;
}

.code_download .btnarea{
	text-align:center;
	margin:0 auto;
	padding-top:25px;
}

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

.box span.code01,
.box span.code02,
.box span.code03{
	padding:4px;
	margin:0 0 0 4px;
	font-size:0.75rem;
}

}

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

#popup #header .inner{
	width:96%;
}

#popupinner{
	width:96%;
}

.prescribe_list li{
	float:none;
	width:100%;
	margin-bottom:2%;
}

.prescribe_list li:nth-child(2n){
	margin-left:0%;
}

.prescribe_list li:nth-child(2n+1){
	clear:both;
}

.box span.code01,
.box span.code02,
.box span.code03{
	margin:2px 0 2px 4px;
}

}

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

h1.title{
	float:none;
	font-size:1.5em;
}

h2.title{
	font-size:1.3em;
}

span.dl{
	float:none;
	display:block;
	text-align:center;
	margin: 0;
}

span.dl a{
	width:100%;
	margin: 0;
	line-height:35px;
	background-size:12px 12px;
}

.box dl dt{
	display:block;
	width:100%;
	font-size:0.9rem;
	margin-bottom:10px;
}

.box dl dd{
	display:block;
	text-align:left;
	width:100%;
}

.box dl dd div{
	float:none;
}

.box dl{
	overflow:hidden;
}

.box span.code01,
.box span.code02,
.box span.code03{
	margin-left:0px;
	margin-right:3px;
}

.box dl.code{
	display:table;
}

.box dl.code dt{
	width:100%;
	display:block;
	margin:0;
}

.box dl.code dd{
	text-align:center;
	width:100%;
	display:block;
	margin:0;
}

.box dl.code dd span:first-child{
	padding-right:15px;
}

.box dl.code dd div{
	margin:0;
}

#yb dl.code{
	display:block;
}

#yb dl.code dt{
	float:left;
	width:50%;
	line-height:2rem;
	text-align:left;
}

#yb dl.code dd{
	float:right;
	width:50%;
	line-height:2rem;
}

#yb dl.code dd div{
	text-align:right;
	width:100%;
}

#yb dl.code dd span.code{
	width:auto;
	float:right;
	line-height:2rem;
}

span.code{
	font-size:0.9rem;
	display:block;
	padding:0;
	margin:0;
	width:auto;
	font-weight:bold;
}

.code_download li{
	float:none;
	width:100%;
	margin-bottom:2%;
}

.code_download li:nth-child(2n){
	margin-left:0%;
}


}

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

.box span.code01,
.box span.code02,
.box span.code03{
	margin-left:0px;
	margin-right:10px;
	margin-bottom:10px;
	display:block;
	width:100%;
	text-align:center;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
	font-size:0.9rem;
}

.box{
	padding:10px;
}

}

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

ul.menu_box li a{
	font-size:0.7rem;
}

span.code01,
span.code02,
span.code03{
	display:block;
	float:none;
	text-align:center;
	padding:4px 13px;
	margin-right:10px;
	margin-bottom:10px;
}

.box dl.code dd span{
	font-size:0.8rem;
}

.prescribe_list li{
	padding-bottom: 4.2em;
}

}