@charset "UTF-8";

/* reset */
html,body,div,span,object,iframe,embed,map,area,
h1,h2,h3,h4,h5,h6,p,blockquote,pre,
abbr,address,cite,code,
del,dfn,em,img,ins,kbd,q,samp,
small,strong,sub,sup,var,
b,i,
dl,dt,dd,ol,ul,li,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td,
article,aside,canvas,details,figcaption,figure, 
footer,header,hgroup,menu,nav,section,summary,
time,mark,audio,video{margin:0;padding:0;border:0;outline:0;}
table{border-collapse:collapse;border-spacing:0}
address,caption,cite,code,dfn,em,strong,th,var,del{font-style:normal;font-weight:normal}
ol,ul{list-style:none}
caption,th{text-align:left}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
q:before,q:after{content:'';content:none;}
abbr,acronym{border:0;font-variant:normal}
sup{vertical-align:text-top}
sub{vertical-align:text-bottom}
input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit}
input,textarea,select{*font-size:100%}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}
img{width:100%; vertical-align:top; }
a{text-decoration:none;outline:0;}
.clear:after{	content:"."; display:block; clear:both; height:0; visibility:hidden; }
strong{	font-weight:bold; color:#000; }

/* base set */
html{ text-align:center;-webkit-text-size-adjust:none;
font-family:'Trajan Pro',Georgia,Verdana, Roboto, "Droid Sans", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
_font-family:'ＭＳ Ｐゴシック', sans-serif; font-size:100%; line-height : 1.5; }
input, textarea, select{ font-family:"游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif; }
body{ background:#eee url(../img/bg_body.jpg) no-repeat top center; color:#333; position:relative; }
header{ margin:24px 12px 24px 12px; }
h1 a{ display:block; width:224px; height:48px; text-indent:100%; white-space:nowrap; overflow:hidden; font-size:0px; line-height:0px;background:url(../img/logo.png) no-repeat center center;background-size:contain; margin:auto; float:left; }
#bnrAply{ box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; width:272px; height:72px;background:#fff; margin:auto;
border:0px solid #eee; -webkit-border-radius:12px; -moz-border-radius:12px;border-radius:12px; display:none; }
#bnrAply p{ display:block; margin:auto; padding-top:6px; }
#bnrAply a{ border:1px solid #fff; color:#fff; border-radius: 6px; box-shadow: 0px 1px 2px #666;
display:block; width:80%; padding:3px; margin:auto; 
background-image: -moz-linear-gradient(top, #72a7e5, #437CBF);
background-image: -ms-linear-gradient(top, #72a7e5, #437CBF);
background-image: -webkit-linear-gradient(top, #72a7e5, #437CBF);
background-image: linear-gradient(top, #72a7e5, #437CBF);
background-clip: padding-box;}

#container{ margin:18px 12px; }
h2{ font-size:200%; font-weight:700; padding:9px 0;
background:url(../img/bg_h2_01.png) no-repeat left bottom, url(../img/bg_h2_02.png) no-repeat right top;
background-color:#758aa7; color:#eee;
-webkit-box-shadow: inset 0px 0px 6px 0 #213556;
-moz-box-shadow: inset 0px 0px 6px 0 #213556;
box-shadow: inset 0px 0px 6px 0 #213556; }

nav{ margin:12px; }
nav ul li{ margin-bottom:0px; }
nav ul li a{ display:block;padding:8px;text-align:center; color:#222; background:#fff;
border:6px solid #eee; -webkit-border-radius:12px; -moz-border-radius:12px;border-radius:12px; }
nav ul li span{ display:block;padding:8px;text-align:center; color:#888; background:#eee;
border:6px solid #eee; -webkit-border-radius:12px; -moz-border-radius:12px;border-radius:12px; }

footer{ margin-top:48px;text-align:center; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; }
footer address{ padding-top:36px; }
#sns{ margin-top:24px; }
#sns ul{ width:296px; overflow:hidden; margin:auto;}
#sns ul li{ float:left; width:65px; height:65px; background:url(../img/bg_sns.png) no-repeat center center;background-size:contain; margin-right:12px; }
#sns ul li:last-child{ margin-right:0px; }
#sns ul li a{ display:block; width:65px; height:65px;background:no-repeat center 12px;background-size:36px 36px;text-indent:100%; white-space:nowrap; overflow:hidden; }
#sns ul li#sns_fb a{ background-image:url(../img/sns_fb.png); }
#sns ul li#sns_tw a{ background-image:url(../img/sns_tw.png); }
#sns ul li#sns_hb a{ background-image:url(../img/sns_hb.png); }
#sns ul li#sns_line a{ background-image:url(../img/sns_line.png); }

p.gotop{ z-index:999; width: 272px; height:48px; position:fixed; margin:0 auto; }
p.gotop a{ width:272px; height:48px; display: block; background:url(../img/btn_top.png) no-repeat; background-size:contain; text-indent:100%; white-space:nowrap; overflow:hidden; }

/* share */
.fontNormal{ font-family:Verdana, Roboto,"Lucida Grande","Verdana","Myriad","Helvetica",sans-serif; }
.att{ font-size:90%; color:#C70078; }
.mg_top{ margin-top:24px; }
.pd_top{ padding-top:24px; }

/* clear */
header:after, nav:after, #sns:after
{ content:".";	display:block; clear:both; height:0; visibility:hidden; }

/* side bar */
#mobnav{ display:none;float:right; }
#mobnav a{ display:block; text-indent:100%; white-space:nowrap; overflow:hidden; font-size:0px; line-height:0px;background:#fff url(../img/btn_mobnav.png) no-repeat left center; background-size:100px 44px;
-webkit-border-radius:4px; -moz-border-radius:4px;border-radius:4px;
-webkit-box-shadow:0 0 1px 1px #ccc;-moz-box-shadow:0 0 1px 1px #ccc;box-shadow:0 0 1px 1px #ccc;}
#mobnav a:hover{ background-color:#f9f9f9; }
.sidr{ display:none;position:absolute;position:fixed;top:0;height:100%;z-index:999999;width:180px;overflow-x:none;overflow-y:auto;background:#f8f8f8;color:#333;-webkit-box-shadow:inset 0 0 4px 4px #ebebeb;-moz-box-shadow:inset 0 0 4px 4px #ebebeb;box-shadow:inset 0 0 4px 4px #ebebeb;border-left:1px solid #aaa; }
.sidr .sidr-inner{padding:0 0 4px}
.sidr.right{left:auto;right:-180px}
.sidr.left{left:-180px;right:auto}
.sidr p.sidr-leader{ font-weight:bold;padding:4px 0;margin:0 0 4px;background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(100%, #dfdfdf));background-image:-webkit-linear-gradient(#ffffff,#dfdfdf);background-image:-moz-linear-gradient(#ffffff,#dfdfdf);background-image:-o-linear-gradient(#ffffff,#dfdfdf);background-image:linear-gradient(#ffffff,#dfdfdf);-webkit-box-shadow:0 0 2px 2px rgba(0,0,0,0.2);-moz-box-shadow:0 0 2px 2px rgba(0,0,0,0.2);box-shadow:0 0 2px 2px rgba(0,0,0,0.2)}
.sidr ul{display:block;margin:0 0 16px;padding:0;border-top:1px solid #dfdfdf;border-bottom:1px solid #fff}
.sidr ul li{display:block;margin:0;line-height:48px;border-top:1px solid #fff;border-bottom:1px solid #dfdfdf}
.sidr ul li:hover,.sidr ul li.active,.sidr ul li.sidr-class-active{border-top:none;line-height:49px}
.sidr ul li:hover>a,.sidr ul li:hover>span,.sidr ul li.active>a,.sidr ul li.active>span,.sidr ul li.sidr-class-active>a,.sidr ul li.sidr-class-active>span{-webkit-box-shadow:inset 0 0 16px 3px #ebebeb;-moz-box-shadow:inset 0 0 16px 3px #ebebeb;box-shadow:inset 0 0 16px 3px #ebebeb}
.sidr ul li a,.sidr ul li span{padding:0 16px;display:block;text-decoration:none;color:#333; }
#sidrAply{ padding:6px 6px 9px; }
#sidrAply a{ display:block; width:168px; height:112px; text-indent:100%; white-space:nowrap; overflow:hidden; font-size:0px; line-height:0px;background:#fff url(../img/bnr_aply.jpg) no-repeat top; background-size:168px; border:1px solid #fff; overflow:hidden;
-webkit-border-radius:4px; -moz-border-radius:4px;border-radius:4px;
-webkit-box-shadow:0 0 1px 1px #ccc;-moz-box-shadow:0 0 1px 1px #ccc;box-shadow:0 0 1px 1px #ccc;}

/* by size */ 
@media screen and ( min-width : 320px ) and (orientation: portrait)  {
h1 a{ display:block; width:210px; height:45px; }
h2{ font-size:180%; font-weight:700; padding:6px 0; }
#mobnav{ display:block; }
#mobnav a{ width:44px; height:44px; }
}
@media screen and ( min-width : 320px ) and (orientation: landscape)  {
#mobnav{ display:block; }
nav ul li{ width:50%;float:left; }
nav ul li:last-child{ width:100%; }
}
@media screen and ( min-width : 480px )  {
h1 a{ display:block; width:238px; height:51px; }
h2{ font-size:200%; font-weight:700; padding:9px 0;}
#mobnav a{ width:100px; height:44px; }
nav ul li{ width:50%;float:left; }
nav ul li:last-child{ width:100%; }
}
@media screen and ( min-width : 768px )  {
header{ margin:24px 24px 24px 24px; }
h1 a{ display:block; width:238px; height:51px; }
#container{ margin:18px 24px; }
nav ul li{ width:25%; }
}
@media screen and ( min-width : 1024px )  {
header{ width:976px; margin:24px auto 24px auto; }
h1 a{ display:block; width:336px; height:72px; }
#bnrAply{ float:right; display:block; }
#mobnav{ display:none; }
#container{ width:976px;margin:18px auto; }
nav{ width:1000px;margin:36px auto; }
nav ul li a, nav ul li span{ font-size:24px; }
}