/* reset.css*/
article, aside, details, figcaption, figure, footer, header, hgroup, img, menu, nav, section { display: block }
a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, center, cite, code, dd, del, details, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video { margin: 0; padding: 0; border: 0; font: inherit; vertical-align: baseline }
body { line-height: 1 }
ol, ul { list-style: none }
blockquote, q { quotes: none }
blockquote:after, blockquote:before, q:after, q:before { content: ''; content: none }
table { border-collapse: collapse; border-spacing: 0 }
img { margin: 0 auto; padding: 0 }/* rest.css*/
div, h1 { box-sizing: border-box; }
/*----------------------------------------------------------------------------------------------
Basic Style 
----------------------------------------------------------------------------------------------*/ 
html { font-size: 62.5%; }
body { width: 100%; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-size: 1.6rem; line-height: 1.7; background-color: #e0e0e0; }
#body__wrap { width: 960px; margin: 0 auto; background: #FFF; border-left: 2px solid #CCC; border-right: 2px solid #CCC; padding: 20px 0 0; text-align: justify; text-justify: inter-ideograph; }
.img__left { float: left; padding: 0 1em 1em 0; }
.letter { width: 830px; margin: 0 auto; padding: 20px 0 0; }
.section__area00 { width: 850px; margin: 0 auto 5em; }
.cf:after { content: " "; display: block; clear: both; }

a:link { color: #fff; }
a:visited { color: #fff; }
a:hover { color: #fff; }
a:active { color: #fff; }

.form__button2 { display: table; margin: 2em auto 0; transition: 0.1s; }
.form__button2:hover { filter: brightness(120%); }

/*----------------------------------------------------------------------------------------------
#title
----------------------------------------------------------------------------------------------*/ 
#title { width: 75%; margin: 0 auto 1em; padding: 0.5em 0; border-bottom: 3px solid #03336d; font-weight: bold; font-size: 3.5rem; line-height: 1.3; color: #03336d;text-align: center;}

/*----------------------------------------------------------------------------------------------
.sub-head
----------------------------------------------------------------------------------------------*/ 
h1 { position: relative; padding: .25em 0 .3em .75em; border-left: 6px solid #3498db; font-weight: bold; font-size: 2.5rem; line-height: 1.3; }
h1::after { position: absolute; left: 0; bottom: 0; content: ''; width: 100%; height: 0; border-bottom: 1px solid #ccc; }
.arrow { position: relative; display: inline-block; padding: 0 0 0 16px; color: #000; vertical-align: middle; text-decoration: none; font-size: 2rem; font-weight: bold; margin: 1em auto 0; }
.arrow::before, .arrow::after { position: absolute; top: 0; bottom: 0; left: 0; margin: auto; content: ""; vertical-align: middle; }
.sub-head::before { width: 12px; height: 12px; background: #006baa; }
.sub-head::after { left: 5px; box-sizing: border-box; width: 3px; height: 3px; border: 3px solid transparent; border-left: 3px solid #fff; }
.box { border: 3px solid #006baa; background-color: #f8fdff; width: 40%; padding: 20px; margin: 1em 0; }

/*----------------------------------------------------------------------------------------------
button:hover
----------------------------------------------------------------------------------------------*/ 
 @-webkit-keyframes hvr-wobble-vertical{16.65%{-webkit-transform:translateY(8px);transform:translateY(8px)}33.3%{-webkit-transform:translateY(-6px);transform:translateY(-6px)}49.95%{-webkit-transform:translateY(4px);transform:translateY(4px)}66.6%{-webkit-transform:translateY(-2px);transform:translateY(-2px)}83.25%{-webkit-transform:translateY(1px);transform:translateY(1px)}100%{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes hvr-wobble-vertical{16.65%{-webkit-transform:translateY(8px);transform:translateY(8px)}33.3%{-webkit-transform:translateY(-6px);transform:translateY(-6px)}49.95%{-webkit-transform:translateY(4px);transform:translateY(4px)}66.6%{-webkit-transform:translateY(-2px);transform:translateY(-2px)}83.25%{-webkit-transform:translateY(1px);transform:translateY(1px)}100%{-webkit-transform:translateY(0);transform:translateY(0)}}.hvr-wobble-vertical{display:inline-block;vertical-align:middle;-webkit-transform:translateZ(0);transform:translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-backface-visibility:hidden;backface-visibility:hidden;-moz-osx-font-smoothing:grayscale}.hvr-wobble-vertical:active,.hvr-wobble-vertical:focus,.hvr-wobble-vertical:hover{-webkit-animation-name:hvr-wobble-vertical;animation-name:hvr-wobble-vertical;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;-webkit-animation-iteration-count:1;animation-iteration-count:1}
/*----------------------------------------------------------------------------------------------
.font_style
----------------------------------------------------------------------------------------------*/ 
.u { text-decoration: underline; }
.b { font-weight: bold; }
.r { color: #F00; }
.min { font-size: 3.5rem; font-weight: bold; color: #523a11; font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif; }
.s { font-size: 80%; }
.right { text-align: right; }
/*----------------------------------------------------------------------------------------------
prihead
----------------------------------------------------------------------------------------------*/ 
#prihead{
	z-index:10;
	width:100%;
	font-size:3.7rem;
	font-weight:bold;
	text-align:center;
	/*background:#222;*/
	background:#03336d;
	position: fixed;
}
#prihead #CDT{
	width:960px;
	padding:1rem 0;
	margin:0 auto;
	color:#fff;
	line-height:1.3;
}
#prihead #CDT .count_num{
	display:inline-block;
	padding:0 .4rem;
	margin:0 .4rem;
	border-radius:3px;
	/*color: #c60000;*/
	color: #e8cf23;
	font-size:110%;
	/*background:#fff;*/
	background:#03336d;
	font-family: Verdana, Roboto, "Droid Sans", "游ゴシック", YuGothic, "メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", sans-serif;
}
#prihead_img {width: 960px; margin: 0 auto; padding: 15px 0;}
/*----------------------------------------------------------------------------------------------
header
----------------------------------------------------------------------------------------------*/ 
header { width: 100%; vertical-align: middle; margin: 0 auto; height: 140px; position: relative; background: #000000; background: -moz-linear-gradient(top, #000000 0%, #45484d 100%, #45484d 65%, #000000 100%); background: -webkit-linear-gradient(top, #000000 0%, #45484d 100%, #45484d 65%, #000000 100%); background: linear-gradient(to bottom, #000000 0%, #45484d 100%, #45484d 65%, #000000 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=0 );
}
header img { position: absolute; display: block; height: auto; top: 0; right: 0; bottom: 0; left: 0; margin: auto; }
/*----------------------------------------------------------------------------------------------
button
----------------------------------------------------------------------------------------------*/ 
.btn { text-decoration: none; border: 1px solid #71af2c; padding: 20px; display: block; width: 100%; margin: 40px auto 0; text-align: center; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#8ae05c+0,59b229+100 */
background: rgb(138,224,92); /* Old browsers */ background: -moz-linear-gradient(top, rgba(138,224,92,1) 0%, rgba(89,178,41,1) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(138,224,92,1) 0%, rgba(89,178,41,1) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(138,224,92,1) 0%, rgba(89,178,41,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8ae05c', endColorstr='#59b229', GradientType=0 ); /* IE6-9 */
color: #fff; font-size: 200%; font-weight: bold; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5); box-sizing: border-box; }
.btn:hover { background-color: #0e6b59; border-color: #0e6b59; }
.solid { box-shadow: 0 6px 0 #45911d; position: relative; top: 0; -moz-transition: 100ms all linear; -o-transition: 100ms all linear; transition: 100ms all linear; border-radius: 6px; }
.solid:hover { box-shadow: none; top: 6px; }
/*----------------------------------------------------------------------------------------------
link
----------------------------------------------------------------------------------------------*/ 
.link__wrap { display: flex; width: 830px; box-sizing: border-box; -webkit-justify-content: space-between; /* Safari */ justify-content: space-between; margin: 0 auto 2em; }
.link__box { flex: 1; margin: 1em; }
.link__box img { width: 100%; margin: 0 0 1em; }
/*----------------------------------------------------------------------------------------------
footer
----------------------------------------------------------------------------------------------*/ 
footer { width: 100%; height: auto; margin: 0 auto; background-color: #03336d }
#footer__inner { width: 900px; margin: 0 auto; padding: 25px 0 30px; font-size: 1.1rem; }
#footer__inner_logo { width: 248px; float: left; padding-top: 10px; }
#footer__inner_right { width: 600px; float: right; }
#footer__inner li { float: left; margin-right: 15px; list-style-type: none; padding-right: 10px; }
#footer__inner p { clear: both; padding-top: 5px; color: #fff; text-align: center; }

/*----------------------------------------------------------------------------------------------
youtube
----------------------------------------------------------------------------------------------*/ 
.youtube {width: 700px;text-align: center;margin: 0 auto;}
.youtube iframe {top: 0;right: 0;width: 700px;height: 394px;}

.youtube__box {position: relative;width: 700px;height: 394px;background: #fff;border: 1px solid #CCC;margin:0 auto 30px;text-align:center;}
.youtube__box::before,
.youtube__box::after {content: '';position: absolute;bottom: 10px;width: 40%;height: 10px;box-shadow: 0 10px 10px rgba(0, 0, 0, 0.7);z-index: -1;}
.youtube__box::before {left: 10px;-moz-transform: rotate(-5deg);-webkit-transform: rotate(-5deg);-o-transform: rotate(-5deg);-ms-transform: rotate(-5deg);transform: rotate(-5deg);}
.youtube__box::after {right: 10px;-moz-transform: rotate(5deg);-webkit-transform: rotate(5deg);-o-transform: rotate(5deg);-ms-transform: rotate(5deg);transform: rotate(5deg);}


/*/////////////////////////////////////////////////////////////////
   【 max-width: 640px 】
/////////////////////////////////////////////////////////////////*/ 
@media screen and (max-width: 640px) {
/*----------------------------------------------------------------------------------------------
    Basic Style 
----------------------------------------------------------------------------------------------*/ 
html { font-size: 62.5%; }
body { width: 100%; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-size: 4.5vw; line-height: 1.7; background: #FFF; }
#body__wrap { width: 100%; margin: 0 auto; background: #FFF; box-sizing: border-box; padding: 20px 0 0; border: none; }
img { width: 100%; }
.img__left { float: left; padding: 0 1em 1em 0; width: 35vw; }
.letter { width: 90%; margin: 0 auto; padding: 20px 0 0; }
.section__area00 { width: 100%; margin: 0 auto 5em; }
.box { border: 3px solid #006baa; background-color: #f8fdff; width: 100%; padding: 20px; }
h1 { position: relative; padding: .2em 0 .3em .7em; border-left: 6px solid #3498db; font-weight: bold; font-size: 6vw; width: 90%; margin: 2em auto 0; }
h1::after { position: absolute; left: 0; bottom: 0; content: ''; width: 100%; height: 0; border-bottom: 1px solid #ccc; }
.arrow { font-size: 5.5vw; }
	
.br_sp {white-space: nowrap;line-height: 1.4;display: block;}
/*----------------------------------------------------------------------------------------------
prihead
----------------------------------------------------------------------------------------------*/ 
#prihead #CDT{
	width:100%;
	line-height: 1.6;
}
#prihead{font-size:3.5vw;}
#prihead_img{width: 95%;padding-top: 13px;}
#prihead_img img{width: 100%;}
#prihead #CDT .count_num{font-size:180%;}
/*----------------------------------------------------------------------------------------------
header
----------------------------------------------------------------------------------------------*/ 
header { width: 100%; height: 10vh; margin: 0 auto; position: relative; }
header img { position: absolute; display: block; width: 80%; height: auto; top: 0; right: 0; bottom: 0; left: 0; margin: auto; }
/*----------------------------------------------------------------------------------------------
#title
----------------------------------------------------------------------------------------------*/ 
#title { width: 90%; margin: 0 auto 0.5em; padding: 0.5em 0; border-bottom: 3px solid #03336d; font-weight: bold; font-size: 7vw; line-height: 1.3; color: #03336d; letter-spacing: -1px; }
/*----------------------------------------------------------------------------------------------
link
----------------------------------------------------------------------------------------------*/ 
.link__wrap { display: block; width: 100%; box-sizing: border-box; -webkit-justify-content: space-between; /* Safari */ justify-content: space-between; }
.link__box { flex: 1; margin: 1em; }
.link__box img { width: 100%; margin: 0 0 1em; }
/*----------------------------------------------------------------------------------------------
button
----------------------------------------------------------------------------------------------*/ 
.btn { text-decoration: none; border: 1px solid #71af2c; padding: 10px; display: block; width: 100%; margin: 40px auto 0; text-align: center; color: #fff; font-size: 6vw; font-weight: bold; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5); box-sizing: border-box; }
.btn:hover { background-color: #0e6b59; border-color: #0e6b59; }
.solid { box-shadow: 0 6px 0 #45911d; position: relative; top: 0; -moz-transition: 100ms all linear; -o-transition: 100ms all linear; transition: 100ms all linear; border-radius: 6px; }
.solid:hover { box-shadow: none; top: 6px; }
/*----------------------------------------------------------------------------------------------
footer
----------------------------------------------------------------------------------------------*/ 
footer { width: 100%; height: auto; margin: 0 auto; background-color: #03336d; }
#footer__inner { width: 90%; margin: 0 auto; padding: 25px 0 30px; font-size: 1.1rem; }
#footer__inner_logo { width: 50%; float: none; padding: 10px 0 20px; }
#footer__inner_right { width: 100%; float: none; }
#footer__inner li { float: left; margin-right: 15px; list-style-type: none; padding-right: 10px; }
#footer__inner p { clear: both; padding-top: 5px; color: #fff; text-align: center; }
	
	
/*----------------------------------------------------------------------------------------------
youtube
----------------------------------------------------------------------------------------------*/ 
.youtube {width: 100%;}
.youtube iframe {top: 0;right: 0;width: 100% !important;height: 200px !important;}

.youtube__box {position: relative;width: 99%;height: 200px;background: #fff;border: 1px solid #CCC;margin:0 auto 30px;text-align:center;}
.youtube__box::before,
.youtube__box::after {content: '';position: absolute;bottom: 10px;width: 40%;height: 10px;box-shadow: 0 10px 10px rgba(0, 0, 0, 0.7);z-index: -1;}
.youtube__box::before {left: 10px;-moz-transform: rotate(-5deg);-webkit-transform: rotate(-5deg);-o-transform: rotate(-5deg);-ms-transform: rotate(-5deg);transform: rotate(-5deg);}
.youtube__box::after {right: 10px;-moz-transform: rotate(5deg);-webkit-transform: rotate(5deg);-o-transform: rotate(5deg);-ms-transform: rotate(5deg);transform: rotate(5deg);}


	
}