@charset "utf-8";

/* reset style
----------------------------------------------------------- */

html {
	overflow-y:scroll;
}
body,div,
dl,dt,dd,ul,ol,li,
h1,h2,h3,h4,h5,h6,
pre,form,fieldset,input,textarea,p,blockquote,th,td {
	margin:0;
	padding:0;
}
body,x:-moz-broken {
	margin-left:-1px;
}
h1,h2,h3,h4,h5,h6,p {
	font-weight:normal;
	font-size: 100%;
	text-align:left;
}
ol,ul,li{
	list-style:none;
}
ul,li,img{
	margin:0;
	padding:0;
	list-style:none;
	vertical-align:bottom;
	line-height:1.6;
	text-align:left;
}
caption,th {
	text-align:left;
}
address,caption,cite,code,dfn,em,strong,th,var {
	font-style:normal;
	font-weight:normal;
}
a{
	text-decoration:none;
	outline:0;
	line-height:1.6;
/* Hides from IE-mac \*/
	overflow:hidden;
/* End hide from IE-mac */
}

img,td,th {
	border:0;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
td,th{
	text-align: left;
	vertical-align: top;
}


/* CLEAR FIX*/
.clearfix:after,
p.text:after{
	content: ".";  
	display: block;  
	visibility: hidden;  
	height: 0.1px;  
	font-size: 0.1em;  
	line-height: 0;  
	clear: both;  
}
.clearfix,
p.text{display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix { height: 1%;}
* html p.text { height: 1%;}
.clearfix,
p.text{display: block;}
/* End hide from IE-mac */


/* function
----------------------------------------------------------------------------------*/
/* margin */
.mt0  {margin-top:0px!important;}
.mt5  {margin-top:5px!important;}
.mt10 {margin-top:10px!important;}
.mt15 {margin-top:15px!important;}
.mt20 {margin-top:20px!important;}
.mt25 {margin-top:25px!important;}
.mt30 {margin-top:30px!important;}
.mt40 {margin-top:40px!important;}
.mt50 {margin-top:50px!important;}
.mt60 {margin-top:60px!important;}
.mt90 {margin-top:90px!important;}
.mt100 {margin-top:100px!important;}
.mt150 {margin-top:150px!important;}

.mb0  {margin-bottom:0px!important;}
.mb5  {margin-bottom:5px!important;}
.mb10 {margin-bottom:10px!important;}
.mb15 {margin-bottom:15px!important;}
.mb20 {margin-bottom:20px!important;}
.mb25 {margin-bottom:25px!important;}
.mb30 {margin-bottom:30px!important;}
.mb40 {margin-bottom:40px!important;}
.mb50 {margin-bottom:50px!important;}
.mb60 {margin-bottom:60px!important;}
.mb90 {margin-bottom:100px!important;}
.mb100 {margin-bottom:100px!important;}
.mb150 {margin-bottom:150px!important;}

.mr0  {margin-right:0px!important;}
.mr5  {margin-right:5px!important;}
.mr10 {margin-right:10px!important;}
.mr15 {margin-right:15px!important;}
.mr20 {margin-right:20px!important;}
.mr25 {margin-right:25px!important;}
.mr30 {margin-right:30px!important;}

.ml0  {margin-left:0px!important;}
.ml5  {margin-left:5px!important;}
.ml10 {margin-left:10px!important;}
.ml15 {margin-left:15px!important;}
.ml20 {margin-left:20px!important;}
.ml25 {margin-left:25px!important;}
.ml30 {margin-left:30px!important;}

/* padding */
.pt0  {padding-top:0px!important;}
.pt5  {padding-top:5px!important;}
.pt10 {padding-top:10px!important;}
.pt15 {padding-top:15px!important;}
.pt20 {padding-top:20px!important;}
.pt25 {padding-top:25px!important;}
.pt30 {padding-top:30px!important;}

.pb0  {padding-bottom:0px!important;}
.pb5  {padding-bottom:5px!important;}
.pb10 {padding-bottom:10px!important;}
.pb15 {padding-bottom:15px!important;}
.pb20 {padding-bottom:20px!important;}
.pb25 {padding-bottom:25px!important;}
.pb30 {padding-bottom:30px!important;}

.pr0  {padding-right:0px!important;}
.pr5  {padding-right:5px!important;}
.pr10 {padding-right:10px!important;}
.pr15 {padding-right:15px!important;}
.pr20 {padding-right:20px!important;}
.pr25 {padding-right:25px!important;}
.pr30 {padding-right:30px!important;}

.pl0  {padding-left:0px!important;}
.pl5  {padding-left:5px!important;}
.pl10 {padding-left:10px!important;}
.pl15 {padding-left:15px!important;}
.pl20 {padding-left:20px!important;}
.pl25 {padding-left:25px!important;}
.pl30 {padding-left:30px!important;}

.tL{text-align:left!important;}
.tR{text-align:right!important;}
.tC{text-align:center!important;}
img.tC{display:block;margin:0 auto;}

.fR{float:right!important;}
.fL{float:left!important;}

.clear{clear:both!important;}
.wrap{overflow:hidden;zoom:1;}

.fs12{font-size:85.714%!important;}
.c-green{color:#346238;}


ul.dib,
dl.dib{
	letter-spacing:-0.4em!important;
}
ul.dib li,
dl.dib dt,
dl.dib dd{
	display:inline-block;
	*display:inline;
	vertical-align:top;
	zoom:1;
}
ul.dib *,
dl.dib *{
	letter-spacing:normal;
}

/* common
------------------------------------------------------*/
a:hover img{
    opacity:0.50!important;
    filter: alpha(opacity=50);
	transition: all 0.3s linear;
}

img{
	max-width:100%!important;
	height:auto!important;
}

a[href^="tel:"] {
    pointer-events: none;
	text-decoration:none;
	white-space:nowrap;
	cursor:default;
}
@media screen and (max-width: 990px) {
	a[href^="tel:"] {
   		pointer-events: auto;
		color:#509b58;
		text-decoration:underline;
		cursor:pointer;
	}
	a[href^="tel:"]:hover{
		color:#ff6600;
	}
}

p.note,
span.note{
	font-size:14px;
	line-height:1.5;
	letter-spacing: normal;
}
p.note{
	padding-left:1em;
	text-indent:-1em;
}
p.note *{
	padding-left:0;
	text-indent:0;
}
@media screen and (max-width:420px){
	p.note{
		font-size:12px;
		line-height:1.8;
	}
}

/* fade-in animation */
div,ul,h2,p,img{
  transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  -webkit-transition: opacity 0.6s;
  -o-transition: opacity 0.6s;
}
body {
    animation: fadeIn 2s ease 0s 1 normal;
    -webkit-animation: fadeIn 2s ease 0s 1 normal;
}

a#pagetop_btn,
a#pagetop_btn img{
	opacity:1!important;
}

/* btn style */
a.btn,
input[type="button"].btn{
	display:block;
	width:calc(100% - 30px - 32px);
	max-width:calc(600px - 32px);
	margin:0 auto;
	padding:10px 15px;
	color:#005661;
	text-align:center;
	line-height:1.6;
	letter-spacing:normal;
	text-decoration:underline;
	border:1px #02ab83 solid;
	border-radius:30px;
	-webkit-border-radius:30px;
	-moz-border-radius:30px;
	-ms-border-radius:30px;
	background-color:#fff;
	transition: all 0.3s linear;
	cursor:pointer;
}
.form div#contents div.btn a.btn,
input[type="button"].btn{
	max-width:300px;
}
a.btn:hover,
input[type="button"].btn:hover{
	color:#fff;
	text-decoration:none;
	border:1px #ff6400 solid;
	background-color:#ff6400;
}

a.btn2,
input[type="button"].btn2{
	display:block;
	width: 60%;
	max-width: none;
	margin: 30px auto;
	padding: 12px 15px;
	color:#005661;
	font-size: 20px;
	text-align:center;
	line-height:1.6;
	letter-spacing:normal;
	text-decoration:underline;
	border:1px #639434 solid;
	border-radius:30px;
	-webkit-border-radius:30px;
	-moz-border-radius:30px;
	-ms-border-radius:30px;
	background-color:#fff;
	transition: all 0.3s linear;
	cursor:pointer;
}
a.btn2:hover,
input[type="button"].btn2:hover{
	color:#fff;
	text-decoration:none;
	border:1px #ff6400 solid;
	background-color:#ff6400;
}
@media screen and (max-width:540px){
	a.btn,
	input[type="button"].btn,
	a.btn2,
	input[type="button"].btn2{
		width:calc(100% - 32px);
		font-size:14px;
	}
}

/* link */
a.link,
p.link a,
span.link{
	min-height:26px;
	position: relative;
	padding-left: 30px;
	color:#005661;
	text-decoration:underline;
	transition:all 0.3s linear;
	cursor:pointer;
}
a.link::before,
p.link a::before,
span.link::before {
	width: 25px;
	height: 25px;
	position: absolute;
	top: 1px;
	left: 0;
	content: "";
	display: inline-block;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-ms-border-radius: 50%;
	background: #00326e url(/common/img/arr.png) no-repeat 0.4em center;
	transition: all 0.3s linear;
	background-size:52% auto;
}
a.link:hover:before,
p.link a:hover:before{
	background: #ff6400 url(/common/img/minus.png) no-repeat center center;
}


a.link2,
p.link2 a,
span.link2{
	min-height:10px;
	padding-left: 15px;
	color:#005661;
	text-decoration:underline;
	background: url(../img/arr.png) no-repeat left 0.4em;
	transition:all 0.3s linear;
	cursor:pointer;
}
a.link2:hover,
p.link2 a:hover,
span.link2:hover{
	color:#ff6400;
	text-decoration:none;
}
@media screen and (max-width:720px){
	a.link::before, p.link a::before, span.link::before {
		width: 20px;
		height: 20px;
	}
}



/* table_sp */
div.free_table{
	overflow-x:auto;
}
@media screen and (max-width:670px){
	div.free_table{
		white-space: nowrap;
	}
	div.free_table table{
		width:640px;
		white-space:normal;
	}
}




/* form
------------------------------------------------------*/
.form100{width:78px;}
.form150{width:128px;}
.form200{width:178px;}
.form300{width:278px;}

.form div#contents dl {
  max-width: 924px;
  margin: 0 auto 30px;
  padding: 50px;
  border-radius: 20px;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -ms-border-radius: 20px;
  filter: drop-shadow(10px 10px 10px rgba(0,0,0,0.2));
  background-color: #fff;
}

.form dl {
  margin: 0 auto 30px;
  padding-bottom: 30px;
  border-bottom: 1px #ccc solid;
}
.form dl dt,
.form dl dd{
	margin-top:15px;
	padding-top:15px;
	text-align:left;
	border-top:1px #ccc solid;
}
.form dl dt{
	width:30%;
	padding-right:5%;
}
.form dl dd{
	width:65%;
}
.form div#contents h3.ttl {
	margin-bottom:15px;
	font-size: 26px;
}
input:focus::-webkit-input-placeholder,
textarea:focus::-webkit-input-placeholder {
	color: transparent;
}
input:focus::-moz-placeholder,
textarea:focus::-moz-placeholder {
	color: transparent;
}
input:focus::-ms-input-placeholder,
textarea:focus::-ms-input-placeholder {
	color: transparent;
}
input:focus::placeholder,
textarea:focus::placeholder {
	color: transparent;
}
@media screen and (max-width:1024px){
	.form div#contents h3.ttl {
		font-size: 24px;
	}
}
@media screen and (max-width:960x){
	.form div#contents h3.ttl {
		font-size: 22px;
	}
}
@media screen and (max-width:720px){
	.form div#contents h3.ttl {
		font-size: 20px;
	}
	.form div#contents dl dt,
	.form div#contents dl dd{
		width:100%;
		padding-left:0;
		padding-right:0;
	}
	.form dl dt{
		margin-bottom:15px;
	}
	.form dl dd{
		margin-top:0;
		padding-top:0;
		border-top:none;
	}
	.form dl dd.agreement span.check{
		display:block;
		margin-bottom:5px;
	}
	.form dl dd.agreement a.link{
		display:block;
	}
}
@media screen and (max-width:510px){
	.form div#contents h3.ttl {
		text-align:left;
		font-size: 18px;
	}
}
@media screen and (max-width:420px){
	.form div#contents h3.ttl {
		font-size: 16px;
	}
}

/* flow */
.form div#contents dl p.outline {
	margin-bottom: calc(5.11% + 45px);
	padding-bottom: calc(5.11% + 45px);
	background-repeat: no-repeat;
	background-position: center bottom;
	background-image: url(../../member/img/flow1.png);
	background-size:100% auto;
}
.confirm.form div#contents dl p.outline{
	background-image:url(../../member/img/flow2.png);
}
.thanks.form div#contents dl p.outline{
	background-image:url(../../member/img/flow3.png);
}
.form div#contents dl p.outline span {
	display:block;
	padding-left:1em;
	text-indent:-1em;
}
.form div#contents dl p.outline span:before{
	content:"笳�";
	color:#c8c8c8;
}
@media screen and (max-width:1024px){
	.form div#contents dl {
		padding: 4vw;
	}
}
@media screen and (max-width:510px){
	.form div#contents dl p.outline {
		padding-bottom:calc(12.438% + 15px);
		background-image: url(../../member/img/flow1sp.png);
	}
	.confirm.form div#contents dl p.outline{
		background-image:url(../../member/img/flow2sp.png);
	}
	.thanks.form div#contents dl p.outline{
		background-image:url(../../member/img/flow3sp.png);
	}
}

/* input */
input[type="text"],
input[type="date"],
input[type="password"],
input[type="button"],
input[type="url"],
input[type="submit"],
select,
textarea{
	padding:12px 10px;
	margin-bottom:5px;
	font-size:16px;
	vertical-align:center;
	border:1px #aaa solid;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	-ms-border-radius:5px;
	background-color:#efeded;
	transition:all 0.3s linear;
}
select.form_quater{
	padding: 10px 2.5% 6px;
}
.form_full{
	width:calc(100% - 24px);
	display:block;
	padding:10px;
}
.form_half{width:50%;}
.form_quater{width:25%;}
.form_quater_three{
	width:calc(75% - 15px);
	display:block;
}
select.form_quater{
	width:25.4%;
}
input.pcode{
	width:6em;
}
input.anno_domini{
	width:5em;
}
select#prefect{
	width:10em;
}
input#pcode{
	width:5em;
}
@media (min-width: 720px) and (max-width: 820px) {
	input.zip,
	select#prefect{
		width:calc(50% - 22px - 1.15em);
		padding:10px 10px 8px;
		line-height:1.55;
	}
	select#prefect{
		width:calc(50% - 1.15em);
	}
}
@media screen and (max-width:720px){
	input[type="text"],
	input[type="date"],
	input[type="password"],
	input[type="button"],
	input[type="url"],
	input[type="submit"],
	select,
	textarea,
	button{
		font-size:14px;
	}
	input.zip,
	select#prefect{
		width:calc(50% - 22px - 1.15em);
		padding:10px 10px 8px;
		line-height:1.55;
	}
	select#prefect{
		width:calc(50% - 1.15em);
	}
}

/* mandatory */
span.mandatory,
span.optionary{
	position:relative;
	display:block;
	padding-left:4.5em;
}
span.mandatory:before,
span.optionary:before{
	content:"蠢���";
	width:3em;
	position:absolute;
	top:0;
	left:0;
	display:block;
	margin-right:5px;
	padding:0 0.5em;
	color:#fff;
	text-align:center;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	-ms-border-radius:5px;
	background-color:#62af00;
}
span.optionary:before{
	content:"莉ｻ諢�";
	background-color:#ccc;
}




/* checkbox and radio
------------------------------------------------------*/
.check input[type="checkbox"],
.radio input[type="radio"]{
	display: none;
}
.check label,
.radio label{
	position:relative;
	display:block;
	margin-right:30px;
	padding-left: 30px;
}

/* checkbox */
.check label::before{
	content: "";
	display: block;
	position: absolute;
	top: 2px;
	left: 0;
	width: 18px;
	height: 18px;
	border: 2px solid #32c8e1;
	border-radius: 4px;
}
.check input[type="checkbox"]:checked + label{
	color: #ff4646!important;
	font-weight:bold;
}
.check input[type="checkbox"]:checked + label::after{
	content: "";
	display: block;
	position: absolute;
	top: 0px;
	left: 5px;
	width: 7px;
	height: 14px;
	transform: rotate(40deg);
	border-bottom: 3px solid #ff4646;
	border-right: 3px solid #ff4646;
}

/* radio_btn */
.radio label::before{
	content: "";
	display: block;
	position: absolute;
	top: 2px;
	left: 0;
	width: 20px;
	height: 20px;
	border:2px solid #32c8e1;
	border-radius: 12px;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	-ms-border-radius: 12px;
	cursor:pointer;
}
.radio input[type="radio"]:checked + label{
	color: #ff4646!important;
	font-weight:bold;
}
.radio input[type="radio"]:checked + label::after{
	content: "";
	display: block;
	position: absolute;
	top: 6px;
	left: 5px;
	width: 14px;
	height: 14px;
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	-ms-border-radius: 8px;
	background-color:#ff4646;
}

input#password{
	width: calc(100% - 24px + 10px - 10.3em);
	display:inline-block;
	margin-right:10px;
}
button#btn_passview{
	width:9em;
	display:inline-block;
	padding: 9px 10px 8px;
	vertical-align: top;
}
@media screen and (max-width:540px){
	input#password{
		width: calc(100% - 24px + 10px - 9em - 20px);
	}
}
@media screen and (max-width:420px){
	input#password{
		width: calc(100% - 24px);
	}
}


/* visual editor
------------------------------------------------------*/
div#contents div.text{}
div#contents div.text h1,
div#contents dl#profile dd h1,
div#contents dl.info dd h1{
	margin: 0 auto 30px;
	padding: 47px 0 0;
	font-size: 36px;
	text-align: center;
	background: url(../img/school.png) no-repeat center top;
}

div#contents div.text h2,
div#contents dl#profile dd h2,
div#contents dl.info dd h2{
	clear:both;
	margin: 30px 0 10px;
	padding: 3px 15px 8px;
	color: #005661;
	font-size: 28px;
	line-height:1.4;
	border-left:5px solid #005661;
	border-bottom: 1px solid #005661;
	background: linear-gradient(180deg,#fff, #f5f5f5);
}

div#contents div.text h3,
div#contents dl#profile dd h3,
div#contents dl.info dd h3{
	clear:both;
	margin: 30px 0 10px;
	padding:2px 10px 5px;
	color: #007ec4;
	font-size: 22px;
	border-left:5px solid #007ec4;
	border-bottom: 1px solid #ccc;
	background: linear-gradient(180deg,#fff, #f5f5f5);
}
div#contents div.text h4,
div#contents dl#profile dd h4:not(.pr_ttl),
div#contents dl.info dd h4{
	clear:both;
	margin: 30px 0 10px;
	padding: 0px 10px;
	color: #00a5d5;
	font-size: 18px;
	border-left: 3px solid #00a5d5;
}

div#contents div.text h5,
div#contents dl#profile dd h5,
div#contents dl.info dd h5{
	clear:both;
	margin: 30px 0 10px;
	padding: 0px 10px;
	color: #eb6d87;
	font-size: 18px;
	border-left: 3px solid #eb6d87;
}
div#contents div.text h6,
div#contents dl#profile dd h6,
div#contents dl.info dd h6{
	clear:both;
	margin: 30px 0 10px;
	padding: 0px 10px;
	color: #565656;
	font-size: 18px;
	border-left: 3px solid #565656;
}

div#contents div.text h7{
	min-height:19px;
	margin: 15px 0 10px;
	padding: 0 0 5px 20px;
	background: url(../../../common/img/arrow.png) no-repeat left 0;
}
div#contents div.text ol{
	list-style-type: decimal;
}
div#contents div.text ol li{
	margin-left:1em;
	list-style: decimal;
}


/* submit btn
------------------------------------------------------*/
.form div#contents div.btn{
	margin:0 auto;
	text-align:center;
}
.form div#contents div.btn a.btn,
.form div#contents div.btn input[type="button"].btn,
.form div#contents div.btn button.btn{
	display: inline-block;
	margin:0 15px;
	font-size: 16px;
	vertical-align:top;
	color:#fff;
	background-color:#005661;
	transition: all 0.3s linear;
}
.form div#contents div.btn input#returnBt{
	margin-bottom:15px;
}
.form div#contents div.btn a.btn:hover,
.form div#contents div.btn input[type="button"].btn:hover,
.form div#contents div.btn button.btn:hover{
	background-color:#ff6400;
}
.form div#contents div.btn p.note{
	margin:10px auto;
	font-size:16px;
	text-align:center;
}
@media screen and (max-width:780px){
	.form div#contents div.btn a.btn,
	.form div#contents div.btn input[type="button"].btn {
		margin-bottom: 15px;
	}
}
@media screen and (max-width:720px){
	.form div#contents div.btn p.note{
		font-size:14px;
	}
}
@media screen and (max-width: 540px) {
  .form div#contents div.btn p.note {
  	text-align:left;
  }
}
@media screen and (max-width: 420px) {
  .form div#contents div.btn p.note {
		font-size:12px;
  }
}

/* cms
------------------------------------------------------*/
div#contents div.text td,
div#contents div.text th {
	border:1px #ccc solid;
}

/* error
------------------------------------------------------*/
p.err,
div.err{
	margin:45px auto;
	padding:15px 30px;
	color:red;
	font-size:18px;
	border:3px red solid;
}
/* thanks
------------------------------------------------------*/
p.thanks,
div.thanks{
	margin:45px auto;
	padding:15px 30px;
	color:red;
	font-size:18px;
	text-align:center;
}