@import url(http://fonts.googleapis.com/css?family=Oswald:400,700);
/* Reset */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,#header,.header_inner,hgroup,menu,nav,output,ruby,.section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:16px;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,#header,.header_inner,hgroup,menu,nav,.section,.row{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}
body {font-family: 'Oswald','メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif; background-color:#222;color:#222;width:100%; text-align:center}
a {text-decoration:none}
a:focus { outline:none;}
button:focus { border:none; outline:none !important;}
p, dt,dd { line-height:1.6em; letter-spacing:1px}
iframe {  border: none;  outline: none;}
img{max-width:100%; height:auto}
h1{font-size:28px;  font-weight:bold; clear:both }
h2{color:#ffffff; font-size:38px; font-weight:bold;clear:both}
h3{color:#ffffff; font-size:20px; font-weight:bold}
ul.disc{list-style-type:disc; list-style-position: outside; margin-top:10px;text-align:left;line-height:1.2em}
/* nav */
ul {text-decoration:none;	list-style:none;}
nav {text-align:center;position:relative;height:50px/*auto*/;background:none;margin:0 auto;margin-right:70px;}
nav ul {text-align:center;line-height:50px;}
nav ul li {display:inline-block;height: 50px;position: relative;}
nav ul li img{vertical-align: middle; height:34px; width:auto}
nav ul li a {display: block;padding: 0 2px;letter-spacing: 0.1em;font-size: 14px;font-weight: bold;color: rgb(255, 255, 255);text-decoration: none;transition: all .2s linear;-webkit-transition: all .2s linear;}
nav ul li a:hover, nav ul li.undc {opacity: 0.5;}
/*styling open close button*/
.button {display:none;position:absolute;right:50px;top:6px;z-index:999;font-size:30px;}
.button a {text-decoration:none;}
.btn-open:after {color:#222;content:"\f0c9";font-family:"FontAwesome";transition-property:all .2s linear 0s;-moz-transition:all .2s linear 0s;-webkit-transition:all .2s linear 0s;-o-transition:all .2s linear 0s;}
.btn-open:hover:after {opacity: 0.5;}
.btn-close:after {color:#fff;content:"\f00d";font-family:"FontAwesome";transition-property:all .2s linear 0s;-moz-transition:all .2s linear 0s;-webkit-transition:all .2s linear 0s;-o-transition:all .2s linear 0s;}
.btn-close:hover:after {opacity: 0.5;}
/*overlay*/
.overlay {display:none;position:fixed;top:0;height:100%;width:100%;background:#333;overflow:auto;z-index:99;}
.overlay .wrap .button {right:20px;}
.wrap {color:#e9e9e9;text-align:center;max-width:90%;margin:0 auto;}
.wrap ul.gnav {border-bottom:1px solid #575757;text-transform:capitalize;padding:150px 0px 100px;}
.wrap ul.gnav li {font-size:20px;display:inline-block;vertical-align:top;width:24%;position:relative;}
.wrap ul.gnav li a {color:#ff8d27;display:block;padding:8px 0;text-decoration:none;transition-property:all .2s linear 0s;-moz-transition:all .2s linear 0s;-webkit-transition:all .2s linear 0s;-o-transition:all .2s linear 0s;}
.wrap ul.gnav li a:hover {	color:#f0f0f0;}
.wrap ul.gnav ul {	padding:20px 0;}
.wrap ul.gnav ul li {	display:block;	font-size:13px;	width:100%;	color:#e9e9e9;}
.wrap ul.gnav ul li a {	color:#f0f0f0;}
.wrap ul.gnav ul li a:hover {	color:#ff8d27;}
.nav_txt{display:none}
/* general */
.switch {visibility: hidden;}
.sp_nowrap{display:block}
#container{overflow:hidden; width:100%; background-color:#ffffff;clear:both}
#top_bg{background-image:url(../images/bg.jpg); }
.inner{position:relative; width:96%; max-width:1000px; margin:0 auto; }
#header{ position: fixed;z-index: 10;width:100%;height: 50px;background-color:#ff8d27;}
.logo_main {position:absolute;top:52px;left: 0;right:0;margin:auto;width:50%;z-index:9;}
.head_sns{float:right; margin-right:4px; margin-top:12px}
.head_lng{float:right; margin-left:10px; margin-top:12px}
#header .icn_fb {float:right; width:26px; height:26px; margin-right:6px}
#header .icn_tw {float:right; width:26px; height:26px; margin-right:10px}
#header .lang_en{float:right; width:26px; height:26px; margin-right:4px}
#top, #top_sub{text-align:center; position:relative; z-index:8}
#top .top_slider{width:100%; height:auto;margin:0 auto; overflow:hidden; text-align:center;}
#top img, #top_sub img, ul.link li img{width:100%; height:auto; vertical-align: bottom; display:block; margin: 0 auto;	padding: 0; border:none; outline:none}
#top_sub{border-bottom:solid 6px #222}
#main{background-image:url(../images/bg_sub.jpg);padding-bottom:8% }
#main h1{margin:0 auto;margin-bottom:8%; width:66.6%;}
/* top */
#topics{padding-bottom:4%}
#topics .inner{padding:0;}
#topics p{margin-bottom:10px;}
#topics ul.link {margin-top:50px; padding-bottom:4%; font-weight:bold; text-align:center}
ul.link{overflow:hidden}
ul.link li p{font-weight:bold; font-size:20px;}
ul.link li {display:inline-block;width:46%}
.mv{width:40%; min-width:280px; margin:0 auto; position:relative; top:-100px;margin-bottom:-100px;z-index:9 }
ul.app li {width: 200px; display: inline-block; margin: 0 5px; margin-bottom: 10px;}
.tit_bar{height:38px; width:100%; background:#000000; text-align:center; padding-top:15px; padding-bottom:15px;border-bottom:solid 6px #fff100;clear:both;}
.cnt {overflow: hidden; zoom: 1;}
.cnt li {position: relative;}
.cnt li .title {/*background-color:rgba(252, 66, 164, 0.9);*/}
.cnt li .title {position: absolute;top: 0; right:0; display:inline-block;color:#ffffff;/*padding: 20px 10px 10px 10px;*/width: 50%;box-sizing: border-box;-webkit-box-sizing: border-box;}
.cnt li .title .t_en {margin-bottom: 10px;font-size:28px;}
.cnt li .title span {    display: block;}
.cnt li img { width: 100%; vertical-align: top;}
.t_sub {font-family: notoR;font-weight: bold;font-size: 14px;}
.officialsns{background-image:url(../images/top_sns_bg.jpg); background-repeat:no-repeat; height:800px; background-position: center 60px; background-color:#000 }
.h-bar{padding:12px }
.officialsns .twt, .officialsns .fb {margin-top:8%; margin-bottom:8%;background-color:#000; border:solid 3px #fff; box-sizing:border-box;-moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px;}
.sponsor{margin:50px auto; overflow:hidden}
ul.splink li{display:inline-block; margin:0 20px; vertical-align:middle;margin-bottom:30px}
ul.splink li a{display:block}
.sp_spc ul.splink{width:175px; margin:0 auto}
.sp_spc ul.splink li{display:table-cell; height:100px;}
p.dott {border-bottom:dotted 1px #999; padding-bottom:6px;margin-bottom:30px}
.sp_exc{width:68.5%; float:left;}
.sp_spc{width:23.5%; float:right}
.course{ background-image: url(../images/bg_sub.jpg); overflow:hidden}
/* about */
#main.about h1{margin-bottom:4%}
.about h2,.about p,.about h3{margin-bottom:4%}
.about ul.link{margin-bottom:3%}
ul.abt{margin-bottom:6%}
ul.abt li{display: block; position: relative; text-decoration: none;}
.abt li .abt_txt {position: relative; padding: 20px; text-align: center; box-sizing: border-box; -webkit-box-sizing: border-box;}
.abt li:first-child .abt_img{border-top:solid 6px #000;}
.abt li .abt_img{ border-bottom:solid 6px #000;}
.abt li img {width: 100%; height:auto; vertical-align: top;}
dl.event{width:100%; margin:0 auto; box-sizing:border-box; border-left:dotted 1px #333;border-right:dotted 1px #333; border-bottom:dotted 1px #333;margin-bottom:6%; background-color:#fff;}
dl.event dt{ background-color : #000000; font-weight:bold; color:#ffffff; padding-top : 10px;  padding-bottom : 10px;  padding-left : 10px;  clear : both; border-top:dotted 1px #333;border-bottom:dotted 1px #333}
dl.event dd{ text-align:left; padding-top : 10px;  padding-left : 10px;  padding-right : 10px;  padding-bottom : 10px;}
dl.event dd p{clear:both}
dl.inst{width:100%; margin:0 auto; box-sizing:border-box; border-left:dotted 1px #333;border-right:dotted 1px #333; border-bottom:dotted 1px #333;margin-bottom:6%; background-color:#fff;}
dl.inst dt{ background-color : #ff8d27; font-weight:bold; color:#ffffff; padding-top : 10px;  padding-bottom : 10px;  padding-left : 10px;  clear : both; border-top:dotted 1px #333;border-bottom:dotted 1px #333; font-size:20px}
dl.inst dd{ padding-top : 10px;  padding-left : 10px;  padding-right : 10px;  padding-bottom : 10px;}
dl.inst dd p{text-align:left; clear:both}
.fee_lbl{margin-top:10px;background-color:#0096d9; color:#ffffff; padding:0 6px; width:auto; display:inline-block; line-height:1.7em}
.fee{color:#e72410}
.entry p{margin:2% auto; color:#000}
/* guest */
ul.gst{overflow:hidden}
ul.gst li {margin-bottom:8%}
ul.gst li .prf_pic{width:40%;height:auto;margin-right:7%}
ul.gst li .prf_txt{width:53%;height:auto;}
/* qa page */
.page-header {border-bottom: 3px solid #000000; font-size:38px; line-height:42px;color:#000000; font-weight:bold; text-align:left;margin-bottom:4%;}
h1.page-header, h2.page-header { margin-top:6%;}
h1 .header_txt , h2 .header_txt, .header_txt {text-align:left; color:#ff8d27; display:block;font-size:20px; font-weigh:normal}
.subhead {font-size:20px; font-weight:bold; color:#ffffff; background-color:#000000; text-align:left;
line-height: 20px; padding: 8px 10px 9px 12px; display:block;clear:both; margin-top:30px; margin-bottom:20px}
.que, .ans { background-size:5% auto; line-height:24px; padding-left:70px; padding-top:16px; padding-bottom:24px;}
.que {background: url(../images/icn_que.png) no-repeat top left }
.ans{background: url(../images/icn_ans.png) no-repeat top left;  padding-bottom:30px; border-bottom:1px solid #CCC; margin-bottom:20px}
ul.qa_index {clear:both; margin-bottom:20px; width:104%; margin-right:-4%;overflow:hidden ;}
.triangle{width: 0px;height: 0px;border-style: solid;border-width: 8px 0 8px 12px;border-color: transparent transparent transparent #000000; float:left; margin-right:4px;}
ul.qa_index li a {float:left; margin-right:3%; display:block; padding:10px 0; text-decoration:none; color:#000}
.totop { width:100%;  text-align:right; margin-bottom: 10px; clear:both}
.totop a { text-decoration:none; color:#000;}
/* event */
ul.bl_btn {overflow: hidden;margin: 4% 0 !important;}
ul.bl_btn li {display: inline-block;vertical-align: middle;width: 100%;box-sizing: border-box;max-width: 300px;background-color: #0c5ac4;color: #fff;line-height: 34px;font-size: 22px;font-weight: bold;letter-spacing: 2px;margin: 0 auto;-moz-border-radius: 12px;-webkit-border-radius: 12px;border-radius: 12px;}
ul.bl_btn li a {color: #fff;display: block;padding: 20px;}
/* goods */
.goods{text-align:center}
.goods .header_txt{text-align:center; font-weight:bold}
#main.goods h1{width:60%;background-color:#000;color:#fff;text-align:center; height:60px; line-height:60px;margin-bottom:10px}
.goods h2{color:#000; margin-bottom:10px}
.goods .price{ font-weight:bold;color:#ff8d27; margin-bottom:10px}
/* media page */
ul.media{overflow:hidden}
ul.media li{width: 45%;float: left;border-bottom: 1px solid #B5B5B5;padding-bottom: 5%;margin-bottom:5%;margin-right: 10%;}
ul.media li:nth-child(2n){margin-right:0;}
.news_pic {width: 40%;float: left;margin-right: 10%;}
.news_date, .news_media, .news_tit{width: 50%;float: right;color: #000;font-weight: 400;line-height: 22px;}
.news_date{margin-bottom:10px}
.news_mv{height:60px;margin-top:10px}
.news_media {color:#ff8d27}
/* volunteer page */
table.event {
width: 100%;
max-width:690px;
color:#000;
margin-bottom:50px;
line-height:1.3em;
}
table.event tr{border-bottom: 1px dashed #000;}
table.event tr td {width:120px; font-weight:bold; padding: 20px 0; text-align:left; white-space: nowrap; }
table.event tr td + td{width:auto;max-width:500px;font-weight:normal;white-space: normal; word-break: break-all; word-wrap: break-word;}
#vol_form{padding-top:60px; margin-top:-60px; color:#000}
/* footer */
#footer{background-color:#222;color:#fff; border-top:solid 2px #fff; padding-top:40px;padding-bottom:20px; clear:both; }
#footer ul li{text-align:left;margin-bottom:40px;vertical-align:top; width:auto}
.copyright{font-size:14px}
/* contact */
#contact{text-align:left}
#contact p {margin-bottom:20px;margin-top:20px}
#contact strong, #contact b {font-weight: bold;}
#agree_box {
    width: 93%;
    height: 260px;
    overflow: auto;
    padding: 0px 12px;
    border: 1px solid rgb(204, 204, 204);
}
#agree_box p{font-size:12px}
#agree_box h2{color:#222; font-size:16px}
@media (min-width:900px){
nav ul{margin-left:68px;}
}
@media (min-width:768px){
.br_pc{display:block}
.dropdown-menu>li>a{padding:4px 14px;background-color:#ffffff; border-bottom: solid 1px #cccccc; color:#000000}
.caret{display:inline-block;width:0;height:0;margin-left:3px;vertical-align:middle;border-top:5px solid #000000;border-right:5px solid transparent;border-left:5px solid transparent;border-bottom:0 dotted;content:"";}
.caret{border-top-color:#000;border-bottom-color:#000;}
.open>.dropdown-menu {display: block;}
.dropdown-menu{position:absolute;top:96%;left:0;z-index:1000;display:none;float:left;min-width:118px;padding:0;margin:0;list-style:none;font-size:14px;background-color:#fff;border:1px solid #cccccc;border:1px solid rgba(0, 0, 0, 0.15);border-radius:4px;-webkit-box-shadow:0 6px 12px rgba(0, 0, 0, 0.175);box-shadow:0 6px 12px rgba(0, 0, 0, 0.175);background-clip:padding-box;}
.menu-item, .dropdown-toggle, .dropdown {font-size:16px;text-align:left;letter-spacing:1px;}
ul.dropdown-menu li.menu-item{display:block; height:auto;line-height:30px;}
.overlay {display:none !important;}
.dropdown-menu { position: absolute; left: 0;z-index:2001;display:none;}
#topics ul.link li p{margin-left:30px;}
.cnt li {float: left;width: 50%;transition: all .3s linear;-webkit-transition: all .3s linear;}
.officialsns .twt, .officialsns .fb {float: left;margin-top:8%; margin-bottom:8%; width: 49%; }
.officialsns .twt{margin-right:2%}
.abt {overflow: hidden; zoom: 1;  }
.abt li {position: relative; max-width:1500px;margin:0 auto; text-align:center;transition: all .3s linear; -webkit-transition: all .3s linear;}
.abt li .abt_txt {position: absolute; top: 50%;left: 50%; -webkit-transform: translate(-50%, -50%); /* Safari用 */
  transform: translate(-50%, -50%);padding: 20px 10px 10px 10px;width: 66.6%; max-width:1000px; box-sizing: border-box; -webkit-box-sizing: border-box; } 
}
@media (max-width:1000px){
nav ul li img{height:28px;width:auto;vertical-align:central;}
}
@media (max-width:767px){
h2 {font-size: 32px;}
.wrap ul.gnav>li {width:100%;padding:20px 0;border-bottom:1px solid #575757;}
.wrap ul.gnav>li.undc {opacity: 0.5;}
.wrap ul.gnav {padding:30px 0px 0px;}
nav ul {opacity:0;visibility:hidden;}
.logo_main {position:absolute;top:52px;left: 0;right:0;margin:auto;width:80%;min-width:280px;z-index:9;}
#container{position:relative; top:50px; margin-bottom:50px;}
.inner{width:92%; margin:0 auto; }
#topics .inner{width:100%}
.mv{top:-50px; margin-bottom:-50px;}
nav{float:left; width:100px}
.button {display:inline;}
.officialsns{height:auto; padding-bottom:8%}
iframe#twitter-widget-0{max-width:440px !important}
.sp_exc, .sp_spc{width:100%; float:none; clear:both; margin:0 auto;}
.sp_exc{margin-bottom:16px}
ul.splink li{margin-bottom:45px;}
.sp_spc ul.splink li{height:auto;}
.abt li .abt_img{border-top:solid 6px #000;}
#main.goods h1{width:80%;}
.news_mv{height:40%;}
}
@media (max-width:480px){
#main h1{width:100%}
.inner{width:94%; margin:0 auto; }
#topics .inner{width:94%; padding:0}
.mv{width:80%;}
ul.link li {display:block;width:100%;max-width:528px;margin-bottom:20px}
.cnt ul{overflow:hidden;}
.cnt li a {display: block;position: relative;text-decoration: none;}
.cnt li .title {position: relative;/*padding: 20px;*/text-align: center; width:100%;box-sizing: border-box; -webkit-box-sizing: border-box;}
.cnt li .title .t_en { margin-bottom: 10px;font-size:32px}
.cnt li .title .t_en { font-size:28px}
ul.gst li{margin-bottom:20%}
ul.gst li .prf_pic, ul.gst li .prf_txt{width:100%;height:auto;margin-right:0}
ul.gst li .prf_pic{margin-bottom:8%}
#footer{font-size:14px; line-height:1.4em}
#footer ul.link li{margin-right:0;text-align:center;}
#main.goods h1{width:96%;}
/* media page */
ul.media li{float: none;clear:both;width: 100%;margin-right: 0;overflow:hidden;}
}