@charset "utf-8";

article.container{background:#f3e9e0; position:relative;}

/*--hero--*/
.topimg.f_l {margin-top: -217px;}
.hero .f_r{ overflow:hidden;width:35%; position:relative; margin-top:2em}

.hero .f_r h3{background:url(../img/home/info.gif) 10px no-repeat /*#74b4cd*/#0095d9; color:#fff; line-height:37px; padding:0; text-align:left; text-indent:50px; font-size:1.1em;font-weight:bold}
.hero .f_r h3+a{position:absolute; top:8px; right:1em; color:#FFF; text-decoration:underline}
/*
dl.spbnr{width:100%; background:#FFF; margin:1em auto 0}
dl.spbnr dt{clear:left;float:left; line-height:69px; padding:0 2em; background:#003897;color:#fff; font-weight:bold; position:relative}
dl.spbnr dt:after{content:"";position:absolute;right:-10px;top:32px;height:0;width:0;border-left:10px #003897 solid;border-top:5px transparent solid;border-bottom:5px transparent solid;}
dl.spbnr dd{line-height:0; text-align:center}
*/
dl.spbnr{width:/*230px*/220px;margin:1em auto 0;float:/*right*/left}
dl.spbnr dt{line-height:1.4em; text-align:center;background:/*#003897*/#96002e;color:#fff; font-weight:bold; margin-bottom:.5em; padding:.7em 0}
dl.spbnr dd{ /*background:#f0f0f0;*/ text-align:center; line-height:0; padding:.2em 0}

.hero .f_r .f_l{ margin:1em auto 0;width:40%;}
.hero .f_r .f_l figure{height:121px; overflow:hidden; background:#FFF}
.hero .f_r .f_l figcaption{position:absolute; background:#FFF; width:100%; bottom:0; text-align:center;color:#982d33;font-weight:bold;line-height:1.2em; padding:.2em 0} 
.hero .f_r .f_l img{-webkit-transition: 0.4s;
	-moz-transition: 0.4s;
	-o-transition: 0.4s;
	transition: 0.4s;}
.hero .f_r .f_l a{display:block;}
.hero .f_r .f_l a:hover img{transform:scale(1.05,1.05);}

/*--tile--*/
#home .contents{margin-top:1em;padding-bottom:10em}

.flex figure{line-height:0; position:relative;}
.flex figure img{-webkit-transition: 0.4s;
	-moz-transition: 0.4s;
	-o-transition: 0.4s;
	transition: 0.4s;
}
ul.tile{width:970px;}
ul.tile li{width:303px; overflow:hidden;display:inline-block; margin-bottom:2em; background:#fff; margin-left:1em}
ul.tile li:nth-of-type(3n+1){margin-left:0}
ul.tile figure{height:304px;}
ul.tile figcaption{background:#FFF; padding:.5em 1em; position:absolute; bottom:0;width:100%; line-height:1.6em; height:6em;}
ul.tile h3{color:#982d33;font-weight:bold;}

ul.tile a:hover img{transform:scale(1.05,1.05)}
ul.tile li:hover,.tilebnr li:hover{box-shadow:0 0 10px #982d33;}
ul.tile li.noh:hover{box-shadow:none;}


ul.tile a{position:relative;}
ul.tile a[href$="pdf"]:after{ position:absolute;}

ul.tile li.tube:last-child{display:none;}

ul.bbnr{width:970px; margin-bottom:2em}
ul.bbnr li{overflow:hidden;border:6px #2e7dfe solid;line-height:0;background:#fff;display:inline-block;width:303px;}
ul.bbnr li.wide{border-color:#e9ab0a;width:636px;margin:0 auto}
ul.bbnr a img{-webkit-transition: 0.4s;
	-moz-transition: 0.4s;
	-o-transition: 0.4s;
	transition: 0.4s}
ul.bbnr a:hover img{transform:scale(1.05,1.05)}

/*--second_cont--*/
.second_cont{width:970px; margin-bottom:2em}
#facebook{ float:left; margin-right:1em;}
#facebook iframe{width:520px; height:/*545px 525px*/793px;}

.tilebnr{margin:0 auto 1em; width:44%; float:right}
.tilebnr li{/*width:48%;*/width:100%; /*height:330px;*/ background:#FFF; text-align:center; padding:1em; margin-bottom:1em}
.tilebnr li img{width:85%;}
.tilebnr figcaption{padding-top:1em;line-height:1.6em;}


.movie{width:44%;float:right;}
.movie li{width:48%; background:#FFF; text-align:center; display:inline-block; vertical-align:top}
.movie figcaption{ padding:1em .5em; line-height:1.6em; text-align:left;height:5em}
.sidebnr{width:134px; position:absolute;top:-139px; right:0}
.sidebnr h3{padding:/*5px*/.7em 0; text-align:center; background:#96002e; color:#fff; margin-bottom:.8em;font-weight: bold;line-height: 1.4em;}
.sidebnr h3.gold{background:#ca8a0c; margin-top:2em}
.sidebnr .spbnr{display:none;}
.sidebnr ul{margin-bottom:1em;}

.tube figure{position:relative;}
.tube figure:before{content:url(../img/home/movie.png); position:absolute; top:10%; left:0; right:0; z-index:1000; text-align:center}
.tile .tube figure:before,.tilebnr .tube figure:before{top:25%;}

.hero .tube figure:before{transform:scale(.5); top:0%}

/*--bnr--*/
.bnr{width:970px; margin-bottom:8em}
.bnr h3{font-weight:bold; padding:.5em 0}
.bnr ul{padding:1em; border-top: 1px solid #cb8a0c; border-bottom: 0px solid #cb8a0c; margin-bottom:1em;}
.bnr li{display:inline-block; margin:0 4px}


/*--archive--*/
.archive{position:absolute;/* bottom:2em;*/top:330px; right:0}
.archive h3{padding:5px 0; text-align:center; background:#cb8a0c;color:#fff; margin-bottom:.5em}
.archive ul+h3{margin-top:2em;/* background:#999;*/}

/*--gotop--*//*
p.gotop{text-align:right; font-size:1em;}
p.gotop a{ background:url(../img/common/mark.png) left no-repeat;background-size:contain; display:inline-block; color:#cb8a0c; padding:.2em 1em .2em 2.5em}p.gotop a:hover{background-color:rgba(255,255,0,.2)}
*/

/*--#feed--*/
#feeds{font-size:93%; line-height:1.2em;background:#fff;height:345px;}
#feeds li{padding:5px 10px;border-top:1px #999 dotted;}
#feeds li:first-child{border-top:none;}
#feeds span{display:block; margin-bottom:4px;}
#feeds a{display:block;}


/*--thx--*/
.thx{margin-bottom:1em; border:4px solid #96002e;background:#fff;width:970px; padding:1em 1.5em; text-align:center}
.thx h2{color:#96002e; font-size:2em; font-weight:bold}
.thx h3{color:#96002e;font-size:1.5em; border-bottom: 1px #96002e solid; padding-bottom:.5em; margin-bottom:.5em}
.thx h2 br,.thx h3 br,.thx p.hdn br{display:none;}
.thx p:last-child{margin-top:1em; text-align:right;}
.thx p{font-size:1.2em;} 

@media screen and (max-width: 640px) {
article.container{top:-130px;margin-bottom:-130px}

#home .contents{margin-top:1em;padding-bottom: 1em;}

.topimg.f_l {margin-top:0;}
.hero .f_r {width:100%}
.hero .f_r .f_l,.hero .f_r .spbnr{display:none;}

ul.tile{width:100%;}
ul.tile li{width:49%; margin-left:0}
ul.tile figure{height:auto;}
ul.tile figcaption{padding:.2em 1em;line-height:1.4em; height:4.5em;}
ul.tile figcaption br{display:none}
 
ul.tile li.tube:last-child{display:block;}

ul.bbnr{width:100%;}
ul.bbnr li{width:33%;border-width:2px}
ul.bbnr li.wide{width:66%}

.second_cont,.bnr{width:100%;}
#facebook{float:none; margin-right:0; text-align:center; width:100%;}
#facebook iframe {width: 100%;height:525px}

.tilebnr{margin:1em auto; width:100%; float:none}
.tilebnr li{height:20%;}
.tilebnr li img{width:auto;max-width:100%;}
.movie{width:100%;float:none;}

.sidebnr,.archive,.bnr{width:100%; position:relative; margin-bottom:1em}
.sidebnr{top:0}
.sidebnr ul,.archive ul{width:95%; margin:0 auto; letter-spacing:-.4em}
.sidebnr li,.archive li{width:31%; display:inline-block; margin:1%; letter-spacing:normal}
.sidebnr .spbnr{display:block;}

dl.spbnr{width:80%; margin:0 auto 1em;float:none;}
dl.spbnr dt{float:none;line-height:1em; padding:1em 0;text-align:center}
dl.spbnr dt:after{content:none;}
dl.spbnr dd{line-height:0; text-align:center}
dl.spbnr dd img{max-width:100%;}

.archive{top:0;}

.bnr h3{background:#999; text-align:center; margin-bottom:.5em; color:#fff}
.bnr ul{padding:1em .5em;}
.bnr li{width:30%; margin:1%;}

/*--gotop--*/
p.gotop{text-align:center;}

#feeds{height:auto; margin-bottom:1em}
#feeds+dl.spbnr{display:none;}

.hero .tube figure:before{top:0%}
.tube figure:before{transform:scale(.5); top:0%}
.tube.pc{display:none;}

.bnr .beyond{width:215px; display:block; margin:.5em auto}

.thx{width:100%;}
.thx h2{font-size:1.6em;}
.thx h3{font-size:1.2em;}
.thx h2 br,.thx h3 br,.thx p.hdn br{display:block;}
.thx p{font-size:1em;}

}