@charset "UTF-8";

/* ===================================================================

 file name  :  common.css

=================================================================== */

/* --------------------------------------------------
 common
--------------------------------------------------- */
body{
    width: 100%;
	background: #fff;
	color: #333;
	font: 12px/1.5 "Helvetica Neue", Helvetica, Arial, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, "メイリオ", Meiryo, sans-serif;
	-webkit-text-size-adjust: 100%;;
}
a{
    color:#333;
    text-decoration: none;
}
a:hover{ opacity: .75;}
a:hover img{ opacity: .75;}


.ctr:before,
.ctr:after{ display: block; overflow: hidden; content: "";}
.ctr:after{ clear: both;}
.ctr{ zoom: 1;}

#wrap{ margin: 0 auto; width: 980px;}
.pagetop{ position: fixed; right: 10px;bottom: 10px; display: none;}
.pagetop a{ display: block; width: 35px; height: 35px; background: #adadad; color: #fff; text-align: center; font-size: 16px; line-height: 35px;}


/* --------------------------------------------------
 header
--------------------------------------------------- */
header{ position: relative; padding: 40px 0 0;}
header h1{ line-height: 1;}
header nav{ position: absolute; right: 0; bottom: 0;}
header nav ul{ overflow: hidden; line-height: 1;}
header nav ul li{ float: left; border-right: 1px dotted #333; text-align: center;}
header nav ul li:first-child{ border-left: 1px dotted #333;}
header nav ul li a{ display: block; padding: 8px 25px; letter-spacing: 2px; font-size: 14px;}
header aside{ position: absolute; top: 0; right: 0;}

/* menu */
header #menu{position: absolute; top: 20px; right: 0;  display: none; line-height: 1; cursor: pointer;}
header #menu i{ font-size: 28px;}

#overlay{ position: fixed; top: 0; left: 0; z-index: 100; display: none; width: 100%; height:100%; background: #fff; text-align: center;}
#overlay .overlay-inner{ text-align: center;}
#overlay .overlay-inner2{ padding: 40px 20px 0;}
#overlay .logo{ margin: 0 auto; width: 50%;}
#overlay .logo img{ width: 100%;}
#overlay ul{ margin: 40px 0 0;}
#overlay ul li a{ display: block; padding: 10px 0; border-bottom: 1px dotted #999; letter-spacing: 1px; font-size: 18px;}
#overlay ul li:first-child a{ border-top: 1px dotted #333;}
#overlay #close{ display: inline-block; margin: 40px 0 0; padding: 10px 30px; background: #adadad; color: #fff; cursor: pointer;}


/* --------------------------------------------------
 content
--------------------------------------------------- */
.content{ margin: 30px 0 0; padding: 0 0 30px;}
.content .visual{ height: 220px; background: url(../img/ico_loading.gif) no-repeat 50% 50%;}
.content .rec{ margin: 30px 0 0; line-height: 1;}
.content .rec h2{ font-weight: bold; font-size: 22px;}
.content .rec h2 span{ padding: 0 0 0 20px; color: #999; letter-spacing: 0; font-weight: normal; font-size: 20px;}
.content .rec .box{ margin: 10px 0 0; padding: 5px; background: url(../img/bg_rec.gif);}
.content .rec .box .box-inner{ padding: 10px; background: #fff;}
.content .rec .box .box-inner ul{ overflow: hidden; height: 65px; background: url(../img/ico_loading.gif) no-repeat 50% 50%;}
.content .rec .box2{ display: none;}
.content .rec .box3{ display: none;}
.content .bn{ overflow: hidden; margin: 30px 0 0; width: 1004px; line-height: 1;}
.content .bn section{ float: left; margin: 0 24px 24px 0; width: 227px;}
.content .bn section figure img{ width: 100%;}
.content .bn section figure figcaption{ display: none;}
.content .list-bn li img{ width: 100%;}
.content .list-bn li{ margin: 20px 0 0;}
.content .list-bn li:first-child{ margin: 0;}


/* --------------------------------------------------
 link
--------------------------------------------------- */
.link{ text-align: right;}
.link ul{ overflow: hidden;}
.link ul li{ float: right; margin: 0 24px 0 0; padding: 6px 0 0; width: 227px;}
.link ul li:first-child{ margin: 0;}
.link ul li img{ width: 100%;}


/* --------------------------------------------------
 sns
--------------------------------------------------- */
.sns{ margin: 30px 0 0;}
#fb-root{ display: none;}
.fb_iframe_widget,
.fb_iframe_widget span,
.fb_iframe_widget span iframe[style]{ width: 100% !important;}


/* --------------------------------------------------
 footer
--------------------------------------------------- */
footer{ position: relative; overflow: hidden; margin: 30px 0 0; padding: 0 0 30px; line-height: 1;}
footer .btn{ float: left; box-sizing: border-box; padding: 10px 15px; border: 1px dotted #333;}
footer nav{ float: left;}
footer nav ul{ overflow: hidden;}
footer nav ul li{ float: left; box-sizing: border-box; padding: 10px 15px; border-right: 1px dotted #333;}
footer nav.sp{ display: none; float: none;}
footer nav.sp ul li{ padding: 0; width: 33.3333%; border: none; border-left: 1px dotted #333;}
footer nav.sp ul li:first-child{ border-left: none;}
footer nav.sp ul li a{ display: block; padding: 10px 0; text-align: center; font-size: 10px; line-height: 1;}
footer aside{ float: left;}
footer aside ul{ overflow: hidden;}
footer aside ul li{ float: left; margin: 0 0 0 15px;}
footer aside.sp{ display: none; float: none; clear: left; padding: 10px 0 0;}
footer .copy{ float: right; padding: 10px 0; line-height: 1;}