@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%;}
a.i_pdf{ background: url("../img/common/pdf.png") no-repeat 0px 0px; background-size: 12px 15px; padding-left: 20px; color: #900;}a.i_pdf:hover {color:#f00; text-decoration:underline;}

/* header
--------------------------------------------------------------------------------------*/
#header{
	width: 100%;
	margin: 0;
	padding: 0;
	text-align: center;
	background:url("../img/common/head.png") no-repeat center top;
	background-size: 100% 3px;
}
#header #head{
	max-width: 1200px;
	margin: 0 auto;
	clear: both;
	position:relative;
}

#header #head h1 {
	width: 300px;
	height:50px;
	margin:20px 0;
	padding: 0;
	float:left;
	z-index: 7712;
}

#header #head ul#language{
	margin: 0;
	padding: 0;
	float: right;
}
#header #head #language li{
	margin: 0;
	padding:0;
	float: left;
	line-height: 1;
}

#header #head #language li a {
	position: relative;
	display: flex;
	justify-content: space-around;
	align-items: center;
	margin: 3px auto 0 auto;
	max-width: 120px;
	padding: 8px 20px;
	transition: 0.3s ease-in-out;
	font-weight: 700;
	font-size: 0.9em;
	text-decoration: none;
	background-color: #2ea3dc;
	color: #fff;
}
#header #head #language li.on a{pointer-events: none;cursor: default;	text-decoration:none;background-color: #ccc;color: #b2b2b2;}
#header #head #language li a:hover {background: #f7f7f7;color: #95d4e7;}


/* navigation
--------------------------------------------------------------------------------------*/
#nav{
	height: auto;
	margin: 0;
	padding: 0.5% 0;
	text-align:center;
	background:#000000;
	z-index: 7710;
	position:relative;
}
#about #nav{background-color: #003c1e;}
#program #nav{background-color: #264757;}
#result #nav{background-color: #252506;}
#information #nav{background-color: #062b0c;}
#link #nav{background-color: #004235;}

#nav #navigation{
	max-width: 1200px;
	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;}


#menu li:nth-of-type(1).on, #menu li:nth-of-type(1).on a{color: #f5ffbc;}
#menu li:nth-of-type(2).on, #menu li:nth-of-type(2).on a{color: #bce8ff;}
#menu li:nth-of-type(3).on, #menu li:nth-of-type(3).on a{color: #b0ae1f;}
#menu li:nth-of-type(4).on, #menu li:nth-of-type(4).on a{color: #bac5ac;}
#menu li:nth-of-type(5).on, #menu li:nth-of-type(5).on a{color: #95eae5;}
#menu li:nth-of-type(6).on, #menu li:nth-of-type(6).on a{color: #feffa8;}

.slicknav_menu {display:none;}


/* common
--------------------------------------------------------------------------------------*/

#wrapper{
	width: 100%;
	min-height: 900px;
	margin: 0;
	padding: 0;
}
.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, #006934, #2ea3dc);
	min-width: 100%;
	color: #fff;
	font-size: 12px;
	text-align: center;
}
#footer #contact{
	margin: 0;
	padding: 0.5% 0;
	clear:both;
	text-align: center;
}
#footer #contact a{color: #fff; text-decoration: underline;}

#footer #foot{
	width: 100%;
	margin: 0;
	padding: 0.5% 0;
	clear:both;
	text-align:center;
	background: linear-gradient(135deg, #009e96, #b0ae1f);
	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{
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 td{
	width:auto;
	padding:10px 0 10px 25px;
	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.5;
	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 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.arrow, .dl dd.arrow{background:url("../img/common/arrow.png") no-repeat 0 8px;background-size:9px 7px; padding-left: 16px;}
.lists li.arrowWhite, .dl dd.arrowWhite{background:url("../img/common/arrowWhite.png") no-repeat 0 8px;background-size:9px 7px; padding-left: 16px;}
.lists li.dot{background:url(../img/common/dot.png) no-repeat 2px 8px;background-size:6px 6px; padding-left: 15px;}
.lists li.dotBlack{background:url(../img/common/dotBlack.png) no-repeat 2px 8px;background-size:6px 6px; padding-left: 15px;}
.lists li.circle{background:url(../img/common/circle.png) no-repeat 0 8px;background-size:9px 9px; padding-left: 15px;}
.lists li.circleBlack{background:url(../img/common/circleBlack.png) no-repeat 0 8px;background-size:9px 9px; padding-left: 15px;}
.lists li.circleBlue{background:url(../img/common/circleBlue.png) no-repeat 0 8px;background-size:9px 9px;	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.komeWhite{background:url("../img/common/komeWhite.png") no-repeat 0 3px;background-size:15px 15px; padding-left: 20px;}
.lists li.youtube{font-size: 1.1em;margin-bottom: 5px;}
#result #wrapper .lists li.youtube{font-size: 1em;margin-bottom: 5px;}
.lists li.youtube a{background:url("../img/common/youtube.png") no-repeat right 5px;background-size:20px 15px; padding-right: 30px; padding-top: 4px;padding-bottom: 4px; color: #b02928;}
#result #wrapper .lists li.youtube a{color: #fff;}
p.youtube a{text-align: center;background:url("../img/common/youtube.png") no-repeat right 5px;background-size:20px 15px; padding-right: 30px; padding-top: 5px;padding-bottom: 4px; color: #b02928;}
.lists li.check{background:url("../img/common/check.png") no-repeat 0 9px;background-size:12px 12px; padding-left: 16px;}
.lists li.asterisk{background:url("../img/common/asterisk.png") no-repeat 3px 9px;background-size:9px 9px; padding-left: 15px;}
.lists li.asteriskWhite{background:url("../img/common/asteriskWhite.png") no-repeat 3px 9px;background-size:9px 9px; padding-left: 15px;}
.lists li.asteriskRed{background:url("../img/common/asteriskRed.png") no-repeat 3px 9px;background-size:9px 9px; padding-left: 15px;}

.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.textBox{width: calc(65%);}
.column3 .column.textBox img{
	width: inherit;
	height: auto;
}
.column3 .column img,
.column4 .column img{
	width: 100%;
	height: auto;
}
.program .column4 .column,
#program .column4 .column{
  margin: 0 0 20px 0;
	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%;
}
.column figcaption dt span.master{
	background-color: #2a5e81;
	color: #fff;display: block;
}
.column figcaption dd{
	padding:5% 0;
	font-size: 0.85em;
	line-height: 1.4;
}

.switchHat {
	width: 97%;
	background: #fff;
	text-align: left;
	padding:1% 1.5% 1% 1.5%;
	color: #000;
	font-size:1.5em;
}
.switchHat span{
	background: url("../img/common/arrowD.png") no-repeat 0px 5px;
	background-size: 15px 12px;
	padding-left: 3%;
}
.nowOpen {
	padding:1.2% 1.5% 1% 1.5%;
	background: #feffa8;
	color: #000;
}
.nowOpen span{
	background: url("../img/common/arrowU.png") no-repeat 0px 4px;
	background-size: 15px 12px;
	padding-left: 3%;
}
.closeBtnHat{display:none;}
.switchDetail{padding: 3% 0;}

iframe.youtube169 {
width: 100%;
height: auto;
aspect-ratio: 16 / 9;
}
.youtube169 iframe {
  width: 100%;
  height: 100%;
}
.button a {
    background: #718e9f;
    border-radius: 0;
    position: relative;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 0 auto;
    max-width: 180px;
    padding: 10px 25px;
    color: #fff;
    transition: 0.3s ease-in-out;
    font-weight: 400;
	text-decoration: none;
    border: 1px solid #718e9f;
}
.button.blue a {background: #6c94cb;border: 1px solid #6c94cb;}
.button.yellow a {background: #b0ae1f;border: 1px solid #b0ae1f;}
.button.green a {background: #69a899;border: 1px solid #69a899;}
.button.pdf a {max-width: 280px;background: #b02928;border: 1px solid #b02928;}

.button a:hover {
    background: #fff;
    color: #718e9f;
    border: 1px solid #718e9f;
    border-radius: 25px;
}
.button.blue a:hover {color: #6c94cb;border: 1px solid #6c94cb;}
.button.yellow a:hover {color: #b0ae1f;border: 1px solid #b0ae1f;}
.button.green a:hover {color: #69a899;border: 1px solid #69a899;}
.button.pdf a:hover {color: #b02928;border: 1px solid #b02928;}

.button a:after {
    content: '';
    width: 8px;
    height: 8px;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    transform: rotate(45deg) translateY(-50%);
    position: absolute;
    top: 50%;
    right: 20px;
    border-radius: 1px;
    transition: 0.3s ease-in-out;
}
.button a:hover:after {border-color: #718e9f;}
.button.blue a:hover:after {border-color: #6c94cb;}
.button.yellow a:hover:after {border-color: #b0ae1f;}
.button.green a:hover:after {border-color: #69a899;}
.button.pdf a:hover:after {border-color: #b02928;}




/* ここからタブ
--------------------------------------------------------------------------------------*/
/* 
--------------------------------------------------------------------------------------*/
@media screen and (max-width: 1260px) {
body {
overflow-x: hidden;
}
#header #head{
	max-width: 100%;
	margin: 0 0;
}

#nav #navigation{
	max-width: inherit;
	width: 100%;
	margin: 0 0;
}
img {
	vertical-align: top;
	max-width: 100% !important;
	height: auto;
	-ms-interpolation-mode: bicubic; 
}

#nav #navigation #menu li {
	font-size: 85%;
	padding: 0 1.5%;
}
#wrapper{
width: 90%;
	padding:5% 5%;
	min-height:inherit;
}
}



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

@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: inherit;
	margin: 0 0;
	clear: both;
}

#header #head h1 {
	width:46%;
	height:auto;
	margin:1% 2%;
	box-shadow:none ;
	z-index: 9999 !important;
	position: relative;
}

#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;}



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

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

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


/* footer
--------------------------------------------------------------------------------------*/
#footer {
	clear:both;
	width: 100%;
	margin: 0;
	padding: 0 0;
	background: linear-gradient(135deg, #006934, #2ea3dc);
	min-width: 100%;
	color: #fff;
	font-size: 0.85em;
	text-align: center;
}

#footer #contact{
	margin: 0;
	padding: 2% 0;
	clear:both;
	text-align: center;
}
#footer #foot{
	width: 100%;
	margin: 0;
	padding: 2% 0;
	clear:both;
	text-align:center;
	background: linear-gradient(135deg, #009e96, #b0ae1f);
	color: #fff;
}

.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 {}
.nowOpen span{
	background-position: 0px 8px;
	background-size: 10px 8px;
	padding-left: 5%;
}

table.one{
width: 100%;
margin: 0;
padding: 0;
text-align: left;
border-collapse:collapse;
}
.one th{
	width: auto;
	margin:1% 0;
	padding: 0;
border-bottom:2px dotted #000;
border-right:none;
color: #000;
text-align:left;
font-weight:700;
vertical-align:top;
	white-space: normal;
	display: block;
	word-break: break-all;
}

.one td{
	width: auto;
	display: block; 
	padding:0 0 5% 0;
}

}