@charset "utf-8";

body{
	text-align: center;
	line-height: 1.75;
	font-size: 14px;
	font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
	margin:0;
	padding:0;
	color:#333;
	background-color:#fff;
	overflow-y: scroll;
}
a:link {color:#38427e; text-decoration:underline;}
a:visited {color:#38427e;text-decoration:none;}
a:hover {color:#72abf1; text-decoration:underline;}
a:active {color:#38427e;text-decoration:underline;}
img.icon{width: 25px; height: 20px; margin-top: 0.3%; margin-left: 1%;}


/* header
--------------------------------------------------------------------------------------*/
#header{
	width: 100%;
	margin: 0;
	padding: 0;
	text-align: center;
}

#header #head{
	max-width: 1260px;
	margin: 0 auto;
	clear: both;
}

#header #head h1 {
	width: 150px;
	height:150px;
	margin:30px 0 0 0;
	padding: 0;
	float:left;
	box-shadow: 0 0 10px #999;
	-webkit-box-shadow: 0 0 10px #999;
	-moz-box-shadow: 0 0 10px #999;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	z-index: 7712;
	position:relative;
}

#header #head ul#language{
	height: 23px !important;
	margin: 10px 0 0 0;
	padding: 0;
	float: right;
}
#header #head #language li{
	width: 85px!important;
	height: 23px !important;
	margin: 0;
	padding:0;
	float: left;
}
#header #head #language li.ja.on{ background:url(../img/common/lg_ja_on.png) 0px top no-repeat;}
#header #head #language li.en.on{ background:url(../img/common/lg_en_on.png) 0px top no-repeat;}
#header #head #language li.on img{visibility: hidden;}


/* navigation
--------------------------------------------------------------------------------------*/
#nav{
	height: auto;
	margin:-80px 0 0 0;
	padding: 0.5% 0 0.5% 140px;
	text-align:center;
	background:#3b3b3b;
	z-index: 7710;
	position:relative;
}

#nav #navigation{
	max-width: 1260px;
	width: 100%;
	margin: 0 auto;
	padding: 0;
}

#nav #navigation #menu {
	width: 98%;
	text-align:center;
}
#nav #navigation #menu ul {
	margin: 0;
	padding:0;
	list-style-type:none;
}
#nav #navigation #menu li {
	display:inline-block;
	position:relative;
	text-align:center;
	padding: 0 3%;
	font-size: 90%;
}
#menu li a{ color: #fff; text-decoration: none;}
#menu li a:hover {opacity: .5; filter:alpha(opacity=50); -ms-filter: "alpha( opacity=50 )";-webkit-transition: .3s ease-in-out;transition: .3s ease-in-out;}
#menu li.on{color: #18e7ff;text-decoration: none;}
#menu li.on a{ color: #18e7ff;text-decoration: none;}
.slicknav_menu {display:none;}


/* common
--------------------------------------------------------------------------------------*/
#bnnArea{
width: 100%;
margin: 0;
padding: 0;
text-align: center;
}

#bnnArea .host{
	clear: both;
	margin-bottom: 5%;
}

#bnnArea h3{
	color:#3b3b3b;
	font-size:20px;
	margin: 0 0 20px 0;
	padding:0;
	line-height:1;
	position: relative;
	text-align: center;
	font-weight:400;
}
#bnnArea h3:before {
	border-top: 1px solid #3b3b3b;
	content: "";
	position: absolute;
	top: 42%;
	left: 0;
	width: 100%;
}
#bnnArea h3 span {
	background-color: #fff !important;
	display: inline-block;
	padding:0 20px;
	position: relative;
}

#bnnArea p {
	text-align: left;
	margin: 0 0 2% 0;
}

#bnnArea p.alC {
	text-align: center;;
	margin: 0 0 2% 0;
}
#bnnArea p img{
}
#bnnArea p img.fL{
	margin-right: 2%;
}

.boxx{clear:both;}
.box {clear:both;}

.boxBorder{
clear:both;
	border-bottom: 1px dotted #666;
}
.boxColor{
	clear:both;
	background-color:#f6faff;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	border-radius: 7px;
	padding: 18px 24px;
	border: 1px solid #699fdb;
}
.boxColor2{
	clear:both;
	background-color:#fff;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	border-radius: 7px;
	padding: 18px 25px;
	border: 1px solid #666;
}



/* footer
--------------------------------------------------------------------------------------*/
#footer {
clear:both;
width: 100%;
margin: 0;
padding: 0;
	background: linear-gradient(135deg, #e5e4e5, #bcd6e6) ;
	min-width: 100%;
	color: #3b3b3b;
	font-size: 12px;
	text-align: center;
}

#footer #contact{
	margin: 0;
	padding: 0.5% 0;
	clear:both;
	text-align: center;
}
#footer #contact a{color: #3b3b3b; text-decoration: underline;}

#footer #foot{
	width: 100%;
	margin: 0;
	padding: 0.5% 0;
	clear:both;
	text-align:center;
	background: linear-gradient(135deg, #718e9f, #3b3b3b);
	color: #fff;
}

table.zero{
width:100%;
font-size:100%;
text-align:left;
border-collapse:collapse;
}

.zero th{
width:2%;
padding:0 2px 0 0;
text-align:left;
vertical-align:top;
white-space:nowrap;
}
.zero td{
width:auto;
padding: 0;
text-align:left;
vertical-align:top;
}

table.one,
table.one2,
table.one3{
width:100%;
font-size:100%;
text-align:left;
border-collapse:collapse;
}
.one th{
width:2%;
padding:10px 25px 10px 0;
border-right:2px dotted #000;
color: #000;
text-align:right;
font-weight:700;
vertical-align:top;
white-space:nowrap;
}
.one th.th2, .one2 th.th2{padding-top:20px;}
.one3 th{
	padding:8px 16px 8px 0;
	border-right:1px dotted #00346e;
	white-space:nowrap;
	color: #00346e;
	vertical-align:top;
text-align:right;
}
.one th.alL, .one2 th.alL{text-align:left !important;}
.one td{
	width:auto;
	padding:10px 0 10px 25px;
	text-align:left;
	vertical-align:top;
}
.one3 td{
	padding:8px 0 8px 16px;
	vertical-align:top;
}
.one td.tdC, .one2 td.tdC{
	text-align:center;
}

.one2 th{
	width:2%;
	padding:12px 5px 12px 0;
	color: #000;
	text-align:left;
	font-weight:700;
	vertical-align:top;
	white-space:nowrap;
}
.one2 td{
	width:auto;
	padding:12px 0;
	text-align:left;
	vertical-align:top;
}
table.two{
	width:100%;
	font-size:100%;
	text-align:left;
	border-collapse:collapse;
}
.two th{
	margin:0;
	padding:8px 12px;
	text-align:center;
	font-weight:700;
	line-height:1.2;
	vertical-align:middle;
	white-space:nowrap;
	color: #fff;
	background-color:#718e9f;
	border-right:1px solid #fff;
	border-bottom:1px solid #fff;
}
.two td{
	width:auto;
	margin: 0;
	padding:10px 12px;
	text-align:left;
	vertical-align:middle;
	border-bottom:1px solid #fff;
	background-color:#fcfcfc;
}
.two td.bg{background-color:#efefef;}
.two tr:nth-child(even) td{background: #efefef;}
 table.three{
width:100%;
font-size:100%;
text-align:left;
border-collapse:collapse;
	border: 1px solid #ccc;
}
 .three th{
	width: 30%;
	margin:0;
	padding:10px;
	font-size:95%;
	line-height:1.2;
	vertical-align:middle !important;
	border-right:1px solid #ccc;
	border-bottom:1px solid #ccc;
	text-align: center;
}
 .three td{
	width:auto;
	margin: 0;
	padding:10px;
	text-align:left;
	vertical-align:top;
	border-bottom:1px solid #ccc;
}

ul.lists{
	text-align:left;
}
.lists li{
	display:block;
	text-align:left;
}
.lists li.circle{background:url(../img/common/circle.png) no-repeat 0 6px;background-size:12px 12px; padding-left: 15px;}
.lists li.circle2{background:url(../img/common/circle.png) no-repeat 0 6px;background-size:12px 12px;	padding-left: 15px;}
.lists li.kome{background:url("../img/common/kome.png") no-repeat 0 3px;background-size:15px 15px; padding-left: 20px;}
.lists li.komeRed{background:url("../img/common/komeRed.png") no-repeat 0 3px;background-size:15px 15px; padding-left: 20px;}
.lists li.komeWhite{background:url("../img/common/komeWhite.png") no-repeat 0 3px;background-size:15px 15px; padding-left: 20px;}
.lists li.komeWhite.index_only{ background-position: 0 7px;}
.lists li.dot, .dl dd.dot{background:url(../img/common/dot.png) no-repeat 0 8px;background-size:6px 6px; padding-left: 12px;}
.lists li.ar, .dl dd.ar{background:url("../img/common/ar.png") no-repeat 0 8px;background-size:9px 7px; padding-left: 16px;}
.lists li.check{background:url("../img/common/check.png") no-repeat 0 8px;background-size:12px 12px; padding-left: 16px;}
.lists.youtube li{padding:0;}

#second.result .lists li.youtube, #index .lists li.youtube{font-size: 1.1em;margin-bottom: 12px !important;}
#second.result .lists li.youtube a, #index .lists li.youtube a{background:url("../img/common/youtube.png") no-repeat right 5px;background-size:25px 20px; padding-right: 34px; padding-top: 6px; padding-bottom: 6px;}
#second.past .lists li.youtube, #index .lists li.youtube{font-size: 1.1em;margin-bottom: 12px !important;}
#second.past .lists li.youtube a, #index .lists li.youtube a{background:url("../img/common/youtube.png") no-repeat right 5px;background-size:25px 20px; padding-right: 34px; padding-top: 6px; padding-bottom: 6px;}
.lists li.square{background:url(../img/common/dot.png) no-repeat 0 4px;background-size:15px 15px; padding-left: 20px;}
.lists.youtube li img.icon, .ondemmand_txt img.icon{width: 25px; height: 20px; margin-top: 0.3%; margin-left: 1%;}

.dl dt{
	color:#164090;
	text-align:left;
	font-weight:700;
}

/*column*/
.column3,
.column4 {
	display: flex;
  flex-direction: row;
  justify-content: space-between;
  flex-wrap: wrap;
	align-content:flex-start;
	word-wrap:break-word;	
  -webkit-box-pack:justify;
  -ms-flex-pack:justify;
}
.column3 .column{
  margin: 0 0 5% 0;
  width: calc(30%);
	display: table;
 }
.column3::after {
	width: calc(30%);
	display: block;
	content:"";
}
.column3 .column img,
.column4 .column img{
	width: 100%;
	height: auto;
}
.program .column4 .column{
	padding-bottom: 0;
}
.column4 .column{
  margin: 0 0 30px 0;
  width: calc(22%);
	padding-bottom: 2%;
	display: table;
}
.column4::after {
	content: "";
	display: block;
	width: calc(22%);
}
.column4::before {
	content: "";
	display: block;
	width: calc(22%);
	height: 0;
	order: 1;
}
.column figcaption dl{
}
.column figcaption dt{
	background-color: #eaf6fc;
	color: #2a5e81;
	font-weight: 700;
	padding:4% 1%;
	border-bottom: 1px solid #2a5e81;
}
.column figcaption dt span.master{
	background-color: #2a5e81;
	color: #fff;display: block;
}
.column figcaption dd{
	padding:3% 1%;
	font-size: 0.9em;
  background-size: 1px 1px;
}
/*
.column .item img{	width: 100%; height: auto; }
*/
.switchHat {
	width: 97%;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	background: linear-gradient(-45deg, #cddbe5, #4f565b);
	text-align: left;
	padding:1.2% 1.5% 1% 1.5%;
	color: #fff;
	font-size:24px;
}
.switchHat span{
	background: url("../img/common/arrowDown.png") no-repeat 0px 5px;
	background-size: 18px 15px;
	padding-left: 3%;
}
.nowOpen {
	padding:1.2% 1.5% 1% 1.5%;
	background: linear-gradient(-135deg, #cddbe5, #4f565b);
}
.nowOpen span{
	background: url("../img/common/arrowUp.png") no-repeat 0px 5px;
	background-size: 18px 15px;
	padding-left: 3%;
}
.closeBtnHat{display:none;}
.switchDetail{padding: 3% 0;}
.mgB40.border{clear:both;border-bottom: 1px dotted #666;}

img.img100{
	width: 100%;
	height: auto;
}

iframe.youtube169 {
width: 100%;
height: auto;
aspect-ratio: 16 / 9;
}
.youtube169 iframe {
  width: 100%;
  height: 100%;
}

/* ここからタブ
--------------------------------------------------------------------------------------*/
/* 
--------------------------------------------------------------------------------------*/
@media screen and (max-width: 1260px) {

img {
	vertical-align: top;
	max-width: 100% !important;
	height: auto;
	-ms-interpolation-mode: bicubic; 
}
#footer #foot ul{
	width: 100%;
}
#nav #navigation #menu li {
	font-size: 85%;
	padding: 0 1.5%;
}

}



/* ここからスマホ
--------------------------------------------------------------------------------------*/
/* 
--------------------------------------------------------------------------------------*/

@media only screen and (max-width: 481px) {
.forPc {display: none;}
.forSp {display: block;}
* {
-webkit-tap-highlight-color: rgba(0,0,0,0);
-webkit-box-shadow: none;
box-shadow: none;   
outline: none;
}

html, body{
	text-align: center;
	width: 100%;
	font-size:14px;
	line-height:1.5;
	min-width:initial;
	-webkit-font-smoothing: antialiased;
	-webkit-text-size-adjust: 100%;
	background:none;
	margin: 0;
	padding: 0;
}

img {
	vertical-align: top;
	width: 100%;
	max-width: 100% !important;
	height: auto;
}
a {word-break: break-all;}


/* header
--------------------------------------------------------------------------------------*/
#header{
	width: 100%;
	margin:0;
	padding: 0;
	text-align: center;
	position:fixed;
	top:0;
	z-index:9999;
	background:#fff;
}

#header #head{
	max-width: 1260px;
	margin: 0 auto;
	clear: both;
}

#header #head h1 {
	width:16%;
	height:auto;
	margin:2% 2%;
	box-shadow:none ;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
}

#header #head ul#language{
	position: absolute;
	right: 0;
	top: 0;
	margin: 0;
	padding: 0;
	float: right;
	z-index: 9955;
}
#header #head #language li{
	margin: 0;
	padding:0;
}
#header #head #language li.ja.on{ background:none; display: none;}
#header #head #language li.en.on{ background:none; display: none;}
#header #head #language li.on img{visibility: none;}

#footer #foot{
	background: none;
}


/* navigation
--------------------------------------------------------------------------------------*/
.slicknav_menu {display:block;}
#nav{display: none;}
	

/* common
--------------------------------------------------------------------------------------*/
#wrapper{
width: 100%;
margin: 0;
padding: 5% 0;
text-align: center;
clear:both;
}

#bnnArea{
	width: 90%;
	clear:both;
	margin: 0 5%;
	padding: 0;
}
#bnnArea h3{
	font-size: 1.3em;
}
#bnnArea .host{
	clear: both;
	margin-bottom: 8%;
}
#bnnArea p img{
	width: 60%;
	padding:2% 20%;
}

#bnnArea p {
	margin: 0 0 5% 0;
}

.box {
clear:both;
	display: block;
}


/* footer
--------------------------------------------------------------------------------------*/
#footer {
clear:both;
width: 100%;
margin: 0;
padding: 2% 0 1% 0;
min-width: 100%;
}

#footer #contact{
	max-width: 100%;
	margin: 0;
	clear:both;
}
#footer #contact dl{
	width:96%;
	text-align: left;
	margin: 2% 1% 3% 1%;
	padding: 2%;
	position:inherit;
}
#footer #contact dt{
	width: auto;
	float: none;
}
#footer #contact dd{
	margin: 0 0 3px 0;
	padding-left: 0;
	border-left: none;
}
#footer #contact dd a{color: #fff;}


#footer #foot{
}
#footer #foot #footer_menu{
	max-width: 100%;
	margin: 0;
}
#footer #foot ul{
	width: 96%;
	padding: 2%;
	float: none;
}
#footer #foot li{
	display: inline;
	margin-left: 0;
	margin-right: 2%;
}
#footer #foot  li a{
	color: #fff;
	background:url(../img/common/arrow.png) no-repeat left 3px;
	background-size:4px 8px;
	padding-left:11px;
}

.boxColor,
.boxColor2{
	padding: 3%;
}
	
.box70per,
.box80per {
	width: 100%;
margin-left: 0;
margin-right: 0;
clear:both;
}

.scrollbar{
width:100% !important;
overflow: auto;
}
.scrollbar::-webkit-scrollbar{height: 5px;}
.scrollbar::-webkit-scrollbar-track{background: #f1f1f1;}
.scrollbar::-webkit-scrollbar-thumb {background: #bcbcbc;}

.scrollbar table.two{
	width: 300% !important;
}
	/*column*/
.column3 .column{
  margin: 0 1% 5% 1%;
	width: calc(48%);
	display: table;
 }
.switchHat {
	font-size:1.4em;
}
.switchHat span{
	background-position: 0px 8px;
	background-size: 10px 8px;
	padding-left: 5%;
}
.nowOpen {
	/*
	padding:1.2% 1.5% 1% 1.5%;
	background: linear-gradient(-135deg, #76d7fc, #4267af);
	*/
}
.nowOpen span{
	/*
	background: url("../img/common/arrowUp.png") no-repeat 0px 5px;
	*/
	background-position: 0px 8px;
	background-size: 10px 8px;
	padding-left: 5%;
}
	/*
.closeBtnHat{
	display:none;
}
.switchDetail{
	padding: 3% 0;
}
.mgB40.border{clear:both;border-bottom: 1px dotted #666;}
*/

#second.result .lists li.youtube{font-size: 0.95em;margin-bottom: 12px !important;}
#second.result .lists li.youtube a{background:url("../img/common/youtube.png") no-repeat right 5px;background-size:25px 20px; padding-right: 34px; padding-top: 6px; padding-bottom: 6px; color: #900;}
#second.result .lists li.youtube a:hover{color: #f00;}

#second.past .lists li.youtube{font-size: 0.95em;margin-bottom: 12px !important;}
#second.past .lists li.youtube a{background:url("../img/common/youtube.png") no-repeat right 5px;background-size:25px 20px; padding-right: 34px; padding-top: 6px; padding-bottom: 6px; color: #900;}
#second.past .lists li.youtube a:hover{color: #f00;}

}