@charset "UTF-8";

#contents .container { padding: 0 14px; }
.ex_button { display: inline-block; padding: 0.75em 50px; background-color: #fff; border: 1px solid #b3b3b3; font-weight: bold; text-align: center; }
.icon_blank { margin-left: 5px; }
.section_title { margin-bottom: 1em; padding-bottom: 2px; border-bottom: 1px solid #ccc; font-size: 128.5%; font-weight: bold; }
.section_title span { padding-left: 7px; border-left: 4px solid #e60000; }
.link_button a { display: inline-block; background-color: #fff; border: 1px solid #b6b6b6; padding: 0.75em 5px; text-align: center; font-weight: bold; line-height: 1; }

/*#head h1 img { vertical-align: bottom; }*/
#head #keyimg img { vertical-align: bottom; margin-top: 15px; }
#head #summary { margin: 25px 0 30px; padding: 2em 37px; background-color: #fafafa; border: 1px solid #bebcbc; }
#head #summary .catch { font-size:142.8%; font-weight: bold; }
#head #summary .text { margin-top: 1em; font-size:114.2%; }
#head #summary .dl_pdf { float: right; margin-top: 1.25em; }
#head #summary .dl_pdf .ex_button { padding-left: 45px; padding-right: 45px; }
#head #summary .dl_pdf .ex_button img { padding: 0 5px 3px 0; vertical-align: middle; }
#head #summary .ex_details { margin-top: 1.25em; }
#head #summary .ex_details dt { position: absolute; padding-top: 0.35em; font-weight: bold; }
#head #summary .ex_details dd { display: block; padding-top: 0.35em; padding-left: 6.5em; }
#head #summary .ex_details dd:before { display: inline-block; content: ":"; width: 0.75em; margin-left: -0.75em; font-weight: bold; }
#head .link_button { margin-top: 2em; text-align: center; }
#head .link_button a { width: 100%; max-width: 308px; }
#head #qr { margin-top: 15px; text-align: right; font-weight: bold; }

#product_list .item { float: left; width: 287px; margin-bottom: 2em; }
#product_list .item.middle { margin-left: 46px; margin-right: 45px; }
#product_list .item .label { margin-bottom: 0.35em; font-weight: bold; }
#product_list .item .thumb { margin-bottom: 0.65em; }
#product_list .item .thumb img { width: 100%; vertical-align: bottom; }
#product_list .item .link_list li { margin-bottom: 0.35em; }
#product_list .item .label a,
#product_list .item .link_list li a { display: inline-block; padding-left: 12px; background: url(../img/arw.png) no-repeat left 0.45em; }
#product_list .icon_new_pro { width: 50px; margin-right: 5px; vertical-align: middle; }
#product_list .icon_modal { margin-left: 5px; }

#link_wrap .box_link { padding: 1.75em 10px; border: 1px solid #bebcbc; text-align: center; }
#link_wrap .box_link .label { margin: 0; font-size: 128.5%; font-weight: bold; }
#link_wrap .box_link .link { margin: 0.75em 0 0; font-weight: bold; }
#link_wrap .related_links { margin-top: 40px; padding-top: 2em; border-top: 1px solid #d5d5d5; }
#link_wrap .related_links dt { font-weight: bold; margin-bottom: 0.3em; }

#contents #catalog { margin-top: 40px; padding: 35px 50px 40px; background: #e8e8e8; text-align: center; }
#contents #catalog .head { font-size: 171.4%; font-weight: bold; text-align: center; line-height: 1.3; }
#contents #catalog .head:before { content: ""; display: block; margin-top: 0.6em; margin-bottom: -0.6em; border-top: 1px solid #d9d9d9; }
#contents #catalog .head span { display: inline-block; min-height: 27px; background: url(../img/bg_catalog.png) #e8e8e8 no-repeat 10px top; padding: 0 10px 0 40px; }
#contents #catalog .bold { margin-top: 12px; }
#contents #catalog .ex_button { width: 618px; margin: 22px auto 0; padding: 15px 10px 13px; border: 1px solid #B2B2B2; font-size: 114.3%; }
#contents #catalog .ex_button .arw { padding-left: 12px; background: url(../img/arw.png) no-repeat left 0.45em; }
#contents #catalog .ex_button:hover .arw { text-decoration: underline; }

#contents #mailnews { background: #f5f5f5; padding: 32px 50px 37px; border-top: 1px solid #e0e0e0; }
#contents #mailnews .head { font-size: 171.4%; font-weight: bold; text-align: center; line-height: 1.3; }
#contents #mailnews .head:before { content: ""; display: block; margin-top: 0.6em; margin-bottom: -0.6em; border-top: 1px solid #d9d9d9; }
#contents #mailnews .head span { display: inline-block; min-height: 27px; padding: 0 10px 0 45px; background: url(../img/bg_mailnews.png) #f5f5f5 no-repeat 10px top; }
#contents #mailnews .head + p { margin: 15px 0 30px; text-align: center; }
#contents #mailnews #member { float: left; width: 405px; }
#contents #mailnews #member .label { margin-bottom: 15px; font-size: 142.9%; font-weight: bold; text-align: center; color:#e58a2e; }
#contents #mailnews #member .ex_button { background-color: #f29130; color: #FFF; border: 0; }
#contents #mailnews #regist { float: right; width: 405px; }
#contents #mailnews #regist .label { font-size: 142.9%; font-weight: bold; text-align: center; color:#0d4b9e; margin-bottom: 15px; }
#contents #mailnews #regist .ex_button { background-color: #0d4b9e; color: #FFF; border: 0; }
#contents #mailnews #regist .link { margin-top: 10px; text-align: center; font-weight: bold; }
#contents #mailnews .text { margin-bottom: 18px; }
#contents #mailnews .ex_button { font-size: 128.6%; display: table-cell; vertical-align: middle; width: 415px; line-height: 1; padding: 13px 10px 12px; }
#contents #mailnews .ex_button:hover { opacity: 0.8; filter: alpha(opacity=80); }
#contents #mailnews .ex_button small {font-size: 66.7%; }
#contents #mailnews .ex_button .arw { display: inline-block; padding-left: 12px; background: url(../img/arw_white.png) no-repeat 0 0.35em; }
#contents #mailnews .link .arw { display: inline-block; padding-left: 12px; background: url(../img/arw.png) no-repeat 0 0.45em; }

.arw { background: url(../img/arw.png) no-repeat left 0.35em; padding-left: 12px; }

#popup { width: 640px; margin: 0 auto; font-size: 87.5%; }
#popup .close { background-color: #f2f2f2; padding: 25px 0 20px; margin-bottom: 50px; }
#popup .close a { display: block; width: 238px; border: 1px solid #b3b3b3; background-color: #fff; padding: 8px 0 6px; font-size: 85.7%; font-weight: bold; margin: 0 auto; color: #333; text-align: center; text-decoration: none; cursor: pointer; }
#popup .close span:before { content:"× "; }
#popup .close a:hover { text-decoration: underline; }
#popup #products{ background-color: #f2f2f2; }
#popup #products #products_head { display: table; padding: 25px 30px; width: 580px; height: 54px; color: #fff; font-weight: bold; background-color: #0C4B98; }
#popup #products #products_head .comingsoon { display: table-cell; vertical-align: top; width: 50px; }
#popup #products #products_head .comingsoon span { display: block; min-height: 30px; text-align: center; font-weight: bold; background: #fff; font-size: 85.7%; color: #0c4b98; padding: 10px 8px 8px; line-height: 1.2; }
#popup #products #products_head .name { display: table-cell; padding-left: 10px; width: 400px; }
#popup #products #products_head em { font-size: 128.6%; }
#popup #products .section { padding:0 30px; margin-top: 28px; }
#popup #products .section .head { font-weight: bold; margin-bottom: 5px; }
#popup #products .section .note { font-size: 85.7%; }
#popup #products #lead .head { color: #0c4b98; font-size: 114.3%; }
#popup #products #lead .text { float: left; width: 320px; }
#popup #products #lead .img { float: right; position: relative; }
#popup #products #lead .img .product { border: 1px solid #d1d1d1; width: 238px; }
#popup #products #linkarea { margin-top: 30px; padding: 30px; background-color: #D9D9D9; }
#popup #products .info { text-align: center; font-weight: bold; color: #0c4b98; }

#popup #qr { background-color: #f2f2f2; }
#popup #qr .head { background-color: #0c4b98; padding: 25px 30px; width: 580px; color: #fff; font-weight: bold; font-size: 128.6%; text-align: center; }
#popup #qr .image { padding: 30px 0; text-align: center; }
#popup #qr .text { background-color: #d9d9d9; padding: 30px; }
#popup #qr .text .bold { margin-bottom: 10px; }


/* FOR SMARTPHONE
-------------------------------------------------- */
@media screen and (max-width: 640px) {
	#contents .container { padding: 0; }

	/*#head h1 img { max-width: 100%; height: auto; }*/
	#head #keyimg img { max-width: 100%; height: auto; }
	#head #summary { margin: 20px 0; padding: 1em 15px; }
	#head #summary .text { float: none; width: 100%; margin-top: 1em; }
	#head #summary .dl_pdf { float: none; margin-top: 1.35em; }
	#head #summary .dl_pdf a { display: block; width: auto; }
	#head #summary .ex_details { font-size: 92.8%; }
	#head #summary .ex_details dt { padding-top: 0.5em; }
	#head #summary .ex_details dd { padding-top: 0.5em; word-break: break-all !important; }
	#head .link_button { margin: 1.5em 0 0.5em; }
	#head .link_button a {  display: block; width: auto; max-width: inherit; }

	#product_list { padding: 0 8px; }
	#product_list .item { float: none; width: 100%; margin-bottom: 2em; }
	#product_list .item.middle { margin-left: 0; margin-right: 0; }
	#product_list .item .label a,
	#product_list .item .link_list li a { padding-left: 12px; background: url(../img/arw_2x.png) no-repeat left 0.45em; background-size: 8px auto; }

	#link_wrap .box_link { margin-top: 1em; padding: 1.5em 10px; }
	#link_wrap .box_link .label { font-size: 114.2%; }
	#link_wrap .related_links { margin-top: 30px; padding-top: 1.75em; }

	#contents #catalog { margin: 30px -8px 0; padding: 40px 20px; }
	#contents #catalog .head span { background-image: url(../img/bg_catalog_2x.png); background-size: 24px auto; }
	#contents #catalog .ex_button { display: block; width: auto; font-size: 100%; }
	#contents #catalog .ex_button .arw { background: url(../img/arw_2x.png) no-repeat left 0.2em; background-size: 8px auto; }

	#contents #mailnews { margin: 0 -8px; padding: 37px 20px; }
	#contents #mailnews .head span { background-image: url(../img/bg_mailnews_2x.png); background-size: 27px auto; }
	#contents #mailnews .head + p { margin: 13px 0 22px; text-align: center; }
	#contents #mailnews #member { float: none; width:auto; margin-bottom: 30px; }
	#contents #mailnews #member .label { margin-bottom: 12px; font-size: 128.6%; }
	#contents #mailnews #member .text { margin-top: 12px; }
	#contents #mailnews #regist { float: none; width:auto; }
	#contents #mailnews #regist .label { margin-bottom: 12px; font-size: 128.6%; }
	#contents #mailnews .text { margin: 12px 0 10px; }
	#contents #mailnews .ex_button { display: block; font-size: 100%; width: auto; }
	#contents #mailnews .ex_button small {font-size: 78.6%; }
	#contents #mailnews .ex_button .arw { background: url(../img/arw_white_2x.png) no-repeat 0 0.25em; background-size: 8px auto; }
	#contents #mailnews .link .arw { padding-left: 12px; background: url(../img/arw_2x.png) no-repeat 0 0.45em; background-size: 8px auto; }

	#contents .pc_icon { display: inline; padding-left: 3px; vertical-align: baseline!important; }

	#popup { width: auto; position: relative; }
	#popup .close { margin-bottom: 0; }
	#popup .closebtn { position: absolute; top: 0; right: 0; }
	#popup #products #products_head { padding: 30px 20px 40px; box-sizing: border-box; width: 100%;  height: auto; }
	#popup #products .section { padding:0 20px; margin-top: 25px; }
	#popup #products #products_head .comingsoon { width: 4.1em;  }
	#popup #products #products_head .comingsoon span { width: 2.6em; min-height: 0; padding: 0.8em 0.8em; }
	#popup #products #products_head .name { width: auto; }
	#popup #products #lead .text { width: auto; float: none; display: table-cell; }
	#popup #products #lead .img { float: none; margin-bottom: 30px;  }
	#popup #products #lead .img .product {  width: auto; max-width: 100%; }
	#popup #products #linkarea { padding: 20px; }
}