@charset "utf-8";

@import url(https://fonts.googleapis.com/css?family=M+PLUS+Rounded+1c);
@import url(https://fonts.googleapis.com/css?family=Noto+Serif+JP:wght@700);


* {
	margin: 0;
	padding: 0;
}

a:link,a:visited,a:active,a:hover {
	/*display: block;*/
	text-decoration: none;
	color: #eb5f23;
}

img { border: none; }

body {
	font-family: "Meiryo UI" , "メイリオ" , Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , sans-serif;
	/* font-family: "M PLUS Rounded 1c","ヒラギノ丸ゴ ProN W4", "Hiragino Maru Gothic ProN" , "HG丸ｺﾞｼｯｸM-PRO", HGMaruGothicMPRO , "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; */
	font-size: 18px;
	line-height: 1.4em;
	color: #200;
	background-color: #fff;
	/* background-image: url("../img/background.jpg"); */
}
.minchoB {
	font-family: 'Noto Serif JP', "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
	/* font-family: "Sawarabi Mincho","游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; */
	font-weight: bold;
}


#wrapper {
	width: 100%;
	max-width: 960px;
	margin: 0 auto;
}



/* =========================================================
 Header
========================================================= */

#header {
	width: 100%;
	max-width: 960px;
	margin: 0 auto;
	padding: 0 0;
	overflow: hidden;
	top: 0;
	height: calc( 18px + 1em + 20vw * 95 / 187 +  100vw * 45 / 960 );
	max-height: 180px;
	position: fixed;
}


#headerback {
	/* top: 0; */
	width: 100%;
	margin: 0 auto;
	padding: 0;
	background-color: #fff;
}

#headerImageLine {
	position: relative;
	width: 100%;
	height: 18px;
	overflow: hidden;
	margin: 0 auto;
	background-image: url(../img2021/header_topline.png);
	background-size: cover;
}

#headerText {
	position: relative;
	top: 0;
	padding: 0 1em 0 0;
	text-align: right;
}

#headerImageLogo {
	display: block;
	position: relative;
	top: 0;
	width: 20vw;
	max-width: 170px;
	min-width: 100px;
	margin: 0em 0 0 1.2em;
}
#headerImageLogo img { width: 100%; }

#headerLinkCircle {
	position: relative;
	top: -134px; /* calc( -1 *( 18px + 1em + 20vw * 95 / 187 ) ) */
}

#headerLinkCircle img {
	display: block;
	width: 25vw;
	max-width: 204px;
	min-width: 100px;
	margin: 20px 2vw 10px;
}


#headerImage {
	position: relative;
	top: 0px;
	width: 100%;
	max-width: 960px;
	height: 45px; /* calc( 100vw * 45 / 960 ) */
	margin: 0 auto;
	background-image: url(../img2021/header_topwave_bar.jpg);
	background-size: cover;
}


#headerLinkCircle2 {
	width: 100%;
	max-width: 960px;
	height: calc( 100vw * 135 / 960 ); /* calc( 100vw * 45 / 960 ) */
	min-height: 80px;
	margin: 0 auto;

	background-image: url(../img2021/header_topwave_bar2.jpg);
	background-size: cover;
	display: none !important;
}


#headerLinkCircle2 img {
	display: block;
	width: 40vw;
	max-width: 144px;
	min-width: 100px;
	margin: 0 2vw 0;
}


/* =========================================================
 Base headerback  z-index: -1;
========================================================= */

#mainTopImageWave {
	position: absolute;
	z-index: -100;
	width: 100%;
	max-width: 960px;
	height: 445px; /* calc( 100vw * 464 / 1000 ) */
	margin: 134px auto 0; /* TOP:calc( 18px + 1em + 20vw * 95 / 187 + 0px ) */
	background-image: url(../img2021/header_topwave.jpg);
	background-size: cover;

	top: 0;
}


/* =========================================================
 Base
========================================================= */

#main {
	overflow: hidden;
	width: 100%;
	text-align: left;
}

#main .text {
	margin: 10px auto;
	max-width: 800px;
}

#main .title-icon {
	font-size: 120%;
	font-weight: bold;
	line-height: 1.2em;
}

#main .box_link_checkppk {
	margin: 10px 30px;
	max-width: 800px;
	padding: 0.4em;
	text-align: center;
	font-size: 140%;
	font-weight: bold;
	background: linear-gradient(to right, #fff, #c8edff);
	border: 1px solid #6cf;
	cursor:pointer;
}

#footer {
	width: 100%;
	margin: 20px 0;
	padding: 8px;
	text-align: left;
	color: #111;
	background-color: rgba(255,255,255,0.8);
}



/* === news ================================================ */
.news {
	box-sizing: border-box;
	background-color: #fcfcfc;
	border: 1px solid #333;
	margin: 5px auto 12px;
	padding: 8px 16px 20px 16px;
	max-width: 800px;
}
.news0 {
	box-sizing: border-box;
	background-color: #fcfcfc;
	border: 1px solid #333;
	margin:  190px auto 12px;
	padding: 8px 16px 20px 16px;
	max-width: 800px;
}

.flexbox {
	display: flex;
	display: -ms-flexbox;
}
.news > .flexbox > .flexbox_t , .news0 > .flexbox > .flexbox_t { flex: 1; padding-left: 1em; }
.news > .flexbox > .flexbox_d , .news0 > .flexbox > .flexbox_d { flex: 3; padding-left: 1em; }



.news .link_newslist {
	position: relative;
	z-index: 0;
	display: inline-block;
	height: 1.0em;
	width: 1.0em;
	border: 1px solid #999;
	border-radius: 50%;
	text-align: right;
	white-space: nowrap;
	margin: 0 5em 0 0;
}

.link_newslist > a.translate  {
	display: inline-block;
	transform: translate(-0px, -4px);
	color:#999;
}
.link_newslist > a.translate > span.rotate  {
	display: inline-block;
	transform: rotate(90deg)
}






/* === section_title_towa ============================================ */
#section_title_towa {
	background: -moz-linear-gradient(top, #fff8b2, 20%, #FFF);
	background: -webkit-linear-gradient(top, #fff8b2, 20%, #FFF);
	background: linear-gradient(to bottom, #fff8b2, 20%, #FFF);
	
	text-align: center;
}

div.long_banner {
	padding: 8px;
	margin: 10px auto;
	width: 80%;
	max-width: 900px;
	/* min-height: 4em; */
	text-align: center;
	background-color: #fff8b2;
	border: 1px solid #666;

	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
}
@media only screen and (max-width:480px) {
  div.long_banner { margin: 6px auto; width: 90%; }
}

.box_link {
	padding: 3px;
	margin: 3px auto;
	border-bottom: 1px dashed #666;
	max-width: 400px;
	vertical-align: text-top;
}




/* === section_title_pmlg ============================================ */
#section_title_pmlg {
	background: -moz-linear-gradient(top, #fad3a9, 20%, #FFF);
	background: -webkit-linear-gradient(top, #fad3a9, 20%, #FFF);
	background: linear-gradient(to bottom, #fad3a9, 20%, #FFF);
	
	text-align: center;
	line-height: 2.0em;
}
#section_title_pmlg_inner { text-align: left; }

@media only screen and (max-width:576px) {
	#section_title_pmlg_inner { text-align: center; }
}





/* === section_title_check ============================================ */
#section_title_check {
	background: -moz-linear-gradient(top, #d8cee5, 20%, #FFF);
	background: -webkit-linear-gradient(top, #d8cee5, 20%, #FFF);
	background: linear-gradient(to bottom, #d8cee5, 20%, #FFF);
	
	text-align: center;
	line-height: 1.0em;
}

div.long_banner_check {
	padding: 8px;
	margin: 10px auto;
	width: 80%;
	max-width: 650px;
	/* min-height: 4em; */
	text-align: center;
	background-color: #d396c0;
	border: 3px solid #ca3e90;
	cursor:pointer;

	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
}
@media only screen and (max-width:480px) {
  div.long_banner { margin: 6px auto; width: 90%; }
}







/* === section_title_plan ============================================ */
#section_title_plan {
	background: -moz-linear-gradient(top, #c4e6f9, 20%, #FFF);
	background: -webkit-linear-gradient(top, #c4e6f9, 20%, #FFF);
	background: linear-gradient(to bottom, #c4e6f9, 20%, #FFF);
	
	text-align: center;
	line-height: 1.5em;
}


/* === info soudan ============================================ */

div.long_banner_soudan {
	margin: 40px auto;
	margin-bottom: 60px;
	width: 100%;
	max-width: 960px;
	/* min-height: 4em; */
	cursor:pointer;

}
@media only screen and (max-width:620px) {
  div.long_banner_soudan {  }
}


div.long_banner_soudan_tel {
	display: block;
	padding: 5px;
	margin: 10px auto;
	margin-top: 60px;
	width: 90%;
	max-width: 900px;
	/* min-height: 4em; */
	text-align: center;
	background-color: #ec744f;
	border: 1px solid #cc5e46;
	cursor:pointer;

	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
}
@media only screen and (max-width:620px) {
  div.long_banner_soudan_tel { margin: 6px auto; margin-bottom: 30px; width: 95%; }
}


div.long_banner_form {
	padding: 5px;
	margin: 20px auto;
	width: 90%;
	max-width: 900px;
	/* min-height: 4em; */
	text-align: center;
	background-color: #ed86b3;
	border: 1px solid #000000;
	cursor:pointer;

	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
}
@media only screen and (max-width:620px) {
  div.long_banner_form { margin: 6px auto; width: 95%; }
}




/* =========================================================
form
========================================================= */

#form-table {
	margin: 0px auto;
	padding: 0px;
	width: 95%;
	font-size: 100%;
	background-color: #fff;
	/* border: 1px solid #666666; */
}
#form-table th{
	font-weight: normal;
	padding: 8px;
}
#form-table td{
	text-align: left;
	padding: 8px;
}

/* -----form input--------------------------------- */
input, select, textarea {
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}

input.app-txt {
	width: 100%;
	padding: 5px;
	margin:0px 10px 0px 5px;
	font-size: 120%;
	border: 1px solid #aac;
}
div.app-txt {
	width: 100%;
	padding: 5px;
	margin:0px 10px 0px 5px;
	font-size: 120%;
	background-color: #fff;
	border: 1px solid #aac;

	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}

input.app-zip {
	padding: 5px;
	margin:0px 10px 0px 5px;
	font-size: 120%;
	border: 1px solid #aac;

	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}

input.app-radio{
	margin:0px 10px 0px 15px;
	padding: 5px;
	border: 1px solid #aac;
}

select.app_pref {
	margin:0px 10px 0px 5px;
	padding: 5px;
	font-size: 120%;
	border: 1px solid #aac;
}

input.app-tel {
	margin:0px 10px 0px 5px;
	padding: 5px;
	font-size: 120%;
	border: 1px solid #aac;
}

input.app-age {
	margin:0px 10px 0px 5px;
	padding: 5px;
	font-size: 120%;
	border: 1px solid #aac;
}

textarea{
	width: 100%;
	margin:0px 10px 0px 5px;
	padding: 5px;
}

/* -------------------------------------- */

#form_btn {
	display:block;
	margin: 5px auto 35px;
	padding: 8px;
	font-size: 130%;
}

#form_btn_submit {
	display:block;
	margin: 35px auto;
	padding: 8px;
	font-size: 130%;
}

#form_btn_small {
	display:block;
	margin: 0px auto;
	padding: 5px;
	font-size: 80%;
}



/* =========================================================
scroll button
========================================================= */
#page-top {
	position: fixed;
	/* bottom: 60px; */
	right: 40px;
	z-index:1000;
	animation-name: SlideUp;
	animation-duration: 1s;
}
#page-top a {
	padding: 20px 0px;
	display: block;
}
#page-top a img:hover {
	text-decoration: none;
	opacity: 0.8;
}

@media only screen and (max-width: 480px) {
	#page-top {
		right: 10px;
	}
}









/* =========================================================
for change width
========================================================= */

@media only screen and (min-width: 500px) and (max-width: 960px) {
	#mainTopImageWave {
		margin: calc( 18px + 1em + 20vw * 95 / 187 + 0px ) auto 0;
	}
}
@media only screen and (max-width: 500px) {
	#mainTopImageWave {
		margin: 82px auto 0;
	}
}

@media only screen and (max-width: 960px) {
	#headerLinkCircle { top: calc( -1 *( 18px + 1em + 20vw * 95 / 187 ) ); }
	#headerImage { height: calc( 100vw * 45 / 960 ); }
	#mainTopImageWave {
		height: calc( 100vw * 464 / 1000 );
	}
	.news0 { margin:  calc( 18px + 1em + 20vw * 95 / 187 +  100vw * 45 / 960 + 10px ) auto 12px; }
}


@media only screen and (min-width: 575px) and (max-width: 767px) {
	body { font-size: 16px; }

	#header { padding: 0 0; }
	#headerText { font-size: 100%; }

	#headerLinkCircle { top: calc( -1 *( 18px + 1em + 20vw * 95 / 187 ) ); }
	#headerLinkCircle img { width: 25vw; max-width: 200px; margin: 20px 1.6vw 5px; }

}

@media only screen and (min-width: 480px) and (max-width: 575px) {
	body { font-size: 14px; }

	#header { padding: 0 0; height: 170px; }
	#headerText { font-size: 90%; }

/*	#headerImageLogo {
		margin-top: calc( 35px - 9vw );
		margin-bottom: calc( 35px - 9vw );
	}*/

	#headerImage  { display: none !important; }
	#headerLinkCircle  { display: none !important; }
	#headerLinkCircle2 { display: flex !important; }
	#mainTopImageWave  { display: none !important; }

	.news0 { margin-top: 170px; }
	.news > .flexbox , .news0 > .flexbox { flex-direction: column; }
}

@media only screen and (max-width: 480px) {
	body { font-size: 12px; }

	#header { padding: 0 0; height: 170px; }
	#headerText { font-size: 90%; }

	#headerImage  { display: none !important; }
	#headerLinkCircle  { display: none !important; }
	#headerLinkCircle2 { display: flex !important; }
	#mainTopImageWave  { display: none !important; }

	.news0 { margin-top: 170px; }
	.news > .flexbox , .news0 > .flexbox { flex-direction: column; }
}