@charset "utf-8";

.comflexbox {
	width:100%;
	display: flex;
	flex-direction: column;
	justify-content:space-between;
}

.conts3{
	position: relative;
	width:100%;/*93%;7%分、左右に余白*/
	max-width:900px;/*980px*/
	margin:0 auto;
	line-height:1.7;
}


.details_top{
	width:100%;
	/*max-width: 900px;*/
	display: flex;
	flex-direction: row;
	justify-content: space-around;/* center;flex-start;center;space-between;*/
	align-items: flex-start;/*space-around;flex-start;space-between;center;*/
	z-index: 1;
}

@media (max-width: 899px) and (min-width: 501px) {
	.details_top{
		width:100%;
		display: flex;
		flex-direction:column;
		justify-content: center;
		align-items: center;
		z-index: 1;

		/*
		display: block;
		position:static;
		width:100%;
		margin: 0 auto;
		*/

	}
}

@media (max-width: 500px) {
	.details_top{
		display: block;
		position:static;
		width:100%;
		margin: 0 auto;/*追加*/
		/*height: auto;*/
	}
}

.details_topin_l{
	width:auto;
	height: auto;
	/*padding-left: 5%;*/
	z-index: 3;

	display: flex;
	flex-direction: column;
	justify-content:center;/* center;*/
	align-items: center;/*flex-start;center;*/
}

@media (max-width: 899px) and (min-width: 501px) {
	.details_topin_l{
		/*position:static;
		width:100%;
		padding:0;*/
	}
}

@media (max-width: 500px) {
	.details_topin_l{
		position:static;
		width:100%;
		/*height: auto;*/
		padding:0;/*追加*/
	}
}

.details_left_in1{
	margin-top: 20px;
	margin-left:50px;/*50px;*/
	width:400px;
	/*height: 600px;*/
}

@media (max-width: 899px) and (min-width: 501px) {
	.details_left_in1{
		margin: 0 auto;
		/*
		margin: 0 auto;
		height: auto;
		margin: 0 auto;
		*/
	}
}

@media (max-width: 501px) {
	.details_left_in1{
		width: 100%;
		height: auto;
		margin: 0 auto;
		/*margin-top: 60px;
		margin-left: 9%;
		margin-right: 9%;
		width:80%;*/
		/*width:100%;*/
		/*margin: 0 auto;*/
		/*height: auto;*/
	}
}

.details_left_in1 img{
	width:100%;
	max-width:100%;
	height:auto;
}


.details_left_in3{
	/*height: 30px;
	width: auto;
	margin: auto;*/
	width:400px;
	text-align: left;
	margin: 0 auto;
	margin-left: 50px;
}

@media (max-width: 899px) and (min-width: 501px) {
	.details_left_in3{
		width:auto;
		margin: 0 auto;
		/*height: 30px;
		width: auto;
		margin: auto;*/
		text-align: center;
	}
}

@media (max-width: 500px) {
	.details_left_in3{
		width:auto;
		margin: 0 auto;
		text-align: center;
	}
}



@media (max-width: 500px) {

	.text__icon {
	  margin-left: 5px;
	  margin-bottom: 3px;
	  width:30px;
	}


	.sp_right{
		text-align: right;
		margin-right: 1%;
	}
}

.details_inner2{
	text-align: center;
	width:12em;/*70%;40 30%*/
	margin: 0 auto;
	margin-bottom: 0.3em;
	/*position:absolute;
	top:62%;
	left:16%;
	*/
	display: inline-block;
	border:1px solid rgba(230,81,169,1);/*red;*/
	font-size: 2.4em;/*2em 1.8em;0.9em;*/
	line-height: 1;/*1.8em;1.4em;*/
	/*margin-top: 13px;
	margin-left:4%;*/
	padding: 5px 8px;/*5px 8px;*/
	color:rgba(230,81,169,1);/*red;*/
	/*background-color:rgba(255,255,255, 0.5);*/
}

/*-----------------------------------------------
右側
------------------------------------------------*/

.details_topin_r{
	width:100%;
	height: auto;
	/*height: 100%;*/
	/*padding-left: 5%;*/
	z-index: 1;

	display: flex;
	flex-direction: column;
	justify-content:center;/* center;*/
	align-items: center;/*flex-start;center;*/
	position: relative;

	/*position:absolute;
	width: 55%;
	top:0;
	left:55%;
	padding-right: 5%;
	z-index: 1;*/
}


@media (max-width: 899px) and (min-width: 501px) {
	.details_topin_r{
		width:100%;
		height: auto;
		/*height: 100%;*/
		/*padding-left: 5%;*/
		z-index: 1;

		display: flex;
		flex-direction: column;
		justify-content:center;/* center;*/
		align-items: center;/*flex-start;center;*/
		position: static;
	}
}

@media (max-width: 500px) {
	.details_topin_r{
		position:static;
		width:100%;
		padding:0;/*追加*/
		/*height: auto;*/
	}
}

.details_right_inback1{
	width: 400px;
	height: auto;
	position: absolute;/*relative; absolute;*/
	top:300px;
	left:10%;/*0 20%*/
	z-index: 1;
	opacity: 0.3;/*0.1*/
}

@media (max-width: 899px) and (min-width: 501px) {
	.details_right_inback1{

		position:static;
		width:400px;
		margin: 0 auto;

	}
}

@media (max-width: 500px) {
	.details_right_inback1{
		position:static;
		width:100%;
		margin: 0 auto;/*追加*/
	opacity: 0.3;/*0.1*/

		/*height: auto;*/
	}
}

.details_right_inback1 img{
	width:100%;
	max-width:100%;
	height:auto;
	z-index: 1;
}

.details_right_in1{
	width: 400px;
	position: absolute;/*relative; absolute;*/
	top:50px;/*-550px -610px margin-top:60px   590px*/
	left:10%;
	height: auto;

	/*
	margin: -490px auto 40px 0;
	padding:5%;
	padding-right: 100px;*/
	text-align: left;
	/*margin-left: 10%;*/
	color:#293B91;
}
@media (max-width: 899px) and (min-width: 501px) {
	.details_right_in1{
		position:static;
		width:93%;
		margin:-450px 3% 0 auto;
	}
}

@media (max-width: 500px) {
	.details_right_in1{
		position:static;
		width:93%;
		margin:-450px 3% 0 auto;
		/*height: auto;*/
	}
}

.details_right_in1 .text1{
		color:#333;
		font-size: 2.8em;
		line-height: 2.3em;
		margin-left: 3%;/*追加*/
}


@media (max-width: 899px) and (min-width: 501px) {
	/*.font34{
		font-size: 2.8em;
		line-height: 1;
	}
	.details_right_in1 .text1{
			color:#333;
			font-size: 2.4em;
			line-height: 1;
			margin-left: 3%;
	}*/
}

.details_right_inback2{
	width: 285px;
	height: 285px;
	position: absolute;/*relative;absolute;*/
	top:620px;
	left:-20%;/*20%*/
	/*background: url(../img/six_emblem_bk.png);
	repeat:no-repeat;
	background-size: cover;
	background-position:center;*/
	opacity: 0.2;
	z-index: 1;
}

@media (max-width: 899px) and (min-width: 501px) {
	.details_right_inback2{

		position:static;
		width:60%;
		margin: -50px 40% 0 auto;
		z-index: 1;
		opacity: 0.4;

	}
}

@media (max-width: 500px) {
	.details_right_inback2{
		position:static;
		width:60%;
		margin: -50px 40% 0 auto;
		/*height: auto;*/
		z-index: 1;
		opacity: 0.4;
	}
}

.details_right_inback2 img{
	width:100%;
	max-width:100%;
	height:auto;
	z-index: 1;
}

.details_right_in2{
	width: 240px;
	height: auto;/*500px;*/
	position: absolute;/*relative;absolute;*/
	top:350px;/*-770px750px -650*/
	left:35%;/*15%*/
	/*margin: -200px auto 20px 80px;
	padding:4%;
	margin-top:120px;
	padding:0 100px 0 50px;
	padding-left: 100px;*/
	color:#293B91;
	text-align: left;
	line-height: 1;/*2.3em*/
	z-index: 2;
}

@media (max-width: 899px) and (min-width: 501px) {
	.details_right_in2{
		/*width:100%;
		height: auto;
		margin: 0 auto;
		*/
		position:static;
		width:94%;
		height: auto;
		margin: -100px 3% 0 3%;
		z-index: 3;

	}
	.details_right_in2 p{
		margin-left: 3%;
		z-index: 4!important;
	}
}

@media (max-width: 501px) {
	.details_right_in2{
		position:static;
		width:94%;
		height: auto;
		margin: -100px 3% 0 3%;
		z-index: 3;
		/*height: auto;*/
	}
	.details_right_in2 p{
		margin-left: 3%;
		z-index: 4!important;
	}

}

.details_right_in3{
	width: 285px;
	height: auto;/*500px;*/
	position: static;/*absolute;*/
	margin-left: 63%;
	/*top:800px;
	left:20%;*/
	/*padding:4%;
	margin-top:120px;
	padding:0 100px 0 50px;
	padding-left: 100px;*/
	color:#293B91;
	text-align: left;
	/*background: url(../img/six_custom_bk1.png);
	repeat:no-repeat;
	background-size: cover;
	background-position:top;*/
	line-height: 2.3em;
	z-index: 2;
}
@media (max-width: 500px) {
	.details_right_in3{
		position:static;
		width:94%;
		margin: 0 auto 0 3%;
		height: auto;
		z-index: 2;
	}
}






.sp_inback1{
	position:absolute;
	width:70%;
	margin: 0 auto;/*追加*/
	bottom:250px;
	right:30%;
	/*height: auto;*/
	z-index: 1;
	opacity: 0.3;/*0.1*/
}

.sp_inback1 img{
	width:100%;
	max-width:100%;
	height:auto;
	z-index: 1;
}

.sp_inback2{
	position:absolute;
	width:100%;
	margin: 0 auto;/*追加*/
	bottom:-100px;
	/*height: auto;*/
	z-index: -1;
	opacity: 0.3;/*0.1*/
}

.sp_inback2 img{
	width:100%;
	max-width:100%;
	height:auto;
	z-index: 0;
	opacity: 0.3;/*0.1*/

}















#container2{
	width:100%;
	margin:0;
	position: relative;
}


#content100par {
    width:100%;/*7%分、左右に余白*/
    max-width:1200px;
    margin:0 auto;
    line-height:1.7;
}

@media screen and (max-width: 501px) {
	#content100par {
		width:100%;
		max-width:100%;
}}

#content {
    width:100%;/*93%;7%分、左右に余白*/
    max-width:1800px;/*980px*/
    margin:0 auto;
    line-height:1.7;
}

@media screen and (max-width: 501px) {
	#content {
		width:100%;
		max-width:100%;
}}

.contents {
    width:93%;/*7%分、左右に余白*/
    max-width:980px;
    margin:0 auto;
    line-height:1.7;
}

@media screen and (max-width: 501px) {
	.contents {
		width:100%;
		max-width:100%;
}}

.conts{
	width:100%;/*93%;7%分、左右に余白*/
	max-width:1800px;/*980px*/
	margin:0 auto;
	line-height:1.7;
}



@media screen and (max-width: 501px) {
	.conts {
		width:100%;
		max-width:100%;
}}




.buttons {
    padding:1em 0;
    text-align:center;
}

/*faceIn scroll*/
.scrollanime {
	opacity: 0;
}




#mainVisual {
    width:100%;
    /*margin-bottom:1.2em;*/
	position: relative;
}

#mainVisual img {
    width:100%;
    max-width:100%;
	height:auto;

	animation-name: album;
	animation-duration: 10s;
	animation-iteration-count: 1;/*繰り返す回数infiniteで繰り返す*/
	animation-fill-mode:forwards;
	opacity: 0;
}

#mainVisual .img1{
	display: block;
	margin: 0 auto;
}

#mainVisual .img2{
	position: absolute;
	top:0;
	left:0;

	animation-delay:10s;
}

@keyframes album {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

#supermain{/*追加*/
	position: relative;
	width: 100%;
}

#supermain2{/*追加*/
	position: relative;
	width: 100%;
}

#supervisual{
	width:100%;
}

#supertext0{
  position: absolute;
  top: -70px;
  right:21%;/*23%*/
  display: flex;
  width: 100%;
  height: 100%;
  margin: 0;
  align-items: center;
  justify-content: center;
}

@media screen and (max-width: 501px) {
	#supertext0{
		top: 10%;
	    right:0%;
}}

#supertext{
  position: absolute;
  top: -3%;/*-10px*/
  right:21%;/*23%*/
  display: flex;
  width: 100%;
  height: 100%;
  margin: 0;
  align-items: center;
  justify-content: center;
}

@media screen and (max-width: 501px) {
#supertext{
	top: 30%;/*-10px*/
	right:5%;/*23%*/
}}

#supertext1{
  position: absolute;
  top: -3%;/*-10px*/
  right:21%;/*23%*/
  display: flex;
  width: 100%;
  height: 100%;
  margin: 0;
  align-items: center;
  justify-content: center;
}

@media screen and (max-width: 501px) {
#supertext1{
	top: 20%;/*-10px*/
	right:0%;/*23%*/
}}

#supertext2{
  position: absolute;
  top: 55px;
  right:21%;/*23%*/
  display: flex;
  width: 100%;
  height: 100%;
  margin: 0;
  align-items: center;
  justify-content: center;
}

@media screen and (max-width: 501px) {
	#supertext2{
		top: 30%;
		right:0%;/*23%*/
}}

.schedulebox {
	width:100%;
	height: auto;

	position: relative;/*absolute; relative;*/
	top:-250px;/*-300px*/
	text-align: center;
}

.scheduletitle{
	/*position: absolute;*/
	width: 100%;
	margin-top: 7%;
	margin-bottom: 1em;
	color:#293B91;
	font-size: 2.3em;

	/*top:40%;
	left:50%;*/
	text-align: center;
}
#scheduletext{
  position: absolute;
  top: 0;/*13%-10px*/
  left:14%;/*23%*/
  /*display: flex;
  align-items: center;
  justify-content: space-evenly;*//*space-between;center;*/
  width: 70%;
  height: auto;/*260px*/
  max-height: 200px;
  margin: 0;
  padding-bottom: 40px;
	/*padding:5%;*/
background-color: rgba(255, 255, 255, 0.7);
}

#maintext {
	width:300px;
	height: 260px;
	/*margin-bottom:1.2em;*/
	position: relative;

	font-size: 1.2em;/**0.98em;*/
	writing-mode: vertical-rl;
	/*line-height: 1.6; 1.4;*/
	line-height: 2.5;
	text-orientation: upright;
	overflow: hidden;
	/*border: 1px solid #777;*/
	/*background-color:#00ffff;*//*transparent;/**/
}

#maintext_r {
	width:300px;
	height: 260px;
	/*margin-bottom:1.2em;*/
	position: relative;
	font-size: 1.2em;/**0.98em;*/
	/*line-height: 1.6; 1.4;*/
	line-height: 2.5;
	overflow: hidden;
	/*border: 1px solid #777;*/
	/*background-color:#00ffff;*//*transparent;/**/
}

#maintext_s {
	width:65%;
	height: 260px;
	/*margin-bottom:1.2em;*/
	display:flex;
	align-items: center;
	justify-content: center;
	position: relative;
	font-size: 1.2em;/**0.98em;*/
	/*line-height: 1.6; 1.4;*/
	line-height: 2.5;
	overflow: hidden;
	/*border: 1px solid #777;*/
	background-color:rgba(255,255,255,0.4);
}

@media screen and (max-width: 501px) {
	#maintext,#maintext_r {
		font-size: 1.5em;
	}
}

#enterimg{
	position: relative;
	z-index: 10;
	width:200px;
	height: auto;
}

#enterimg2{
	position: relative;
	z-index: 10;
	width:200px;
	height: auto;
}

#enterimg img{
	width:100%;
	max-width:100%;
	height:auto;

	animation-name: album;
	animation-duration: 10s;
	animation-iteration-count: 1;/*繰り返す回数infiniteで繰り返す*/
	animation-fill-mode:forwards;
	opacity: 0;
}

#enterimg2 img{
	width:100%;
	max-width:100%;
	height:auto;

	animation-name: album;
	animation-duration: 10s;
	animation-iteration-count: 1;/*繰り返す回数infiniteで繰り返す*/
	animation-fill-mode:forwards;
	opacity: 0;
}

#enterimg .img1{
	display: block;
	margin: 0 auto;
}

#enterimg .img2{
	position: absolute;
	top:0;
	left:0;

	animation-delay:10s;
}

#enterimg2 .img1{
	display: block;
	margin: 0 auto;
}

#enterimg2 .img2{
	position: absolute;
	top:0;
	left:0;

	animation-delay:10s;
}

#entertext {
	position: relative;
	z-index: 10;
}

#entertext p{
	width:100%;
	max-width:100%;
	height:auto;
	font-size: 1.3em;

	animation-name: album;
	animation-duration: 10s;
	animation-iteration-count: 1;/*繰り返す回数infiniteで繰り返す*/
	animation-fill-mode:forwards;
	opacity: 0;
}

#entertext .txt1{
	color:#ccc;
	display: block;
}

#entertext .txt2{
	color:#333;
	position: absolute;
	top:0;
	right:0;

	animation-delay:10s;
}

#entertext img{

}

#enterfoot {
	position: relative;
	margin-top: -2.3em;
	z-index: 10;
}

@media screen and (max-width: 501px) {
	#enterfoot {
		margin-top: -4.3em;
}}

#enterfoot p{
	width:100%;
	max-width:100%;
	height:auto;
	font-size: 1.1em;

	animation-name: album;
	animation-duration: 10s;
	animation-iteration-count: 1;/*繰り返す回数infiniteで繰り返す*/
	animation-fill-mode:forwards;
	opacity: 0;
}

#enterfoot .txt1{
	color:#ccc;
	display: block;
}

#enterfoot .txt2{
	color:#333;
	position: absolute;
	top:0;
	right:0;

	animation-delay:10s;
}

@media screen and (max-width: 501px) {
	#maintext,#maintext_r {
		width:200px;
		height: 160px;
		font-size: 0.8em;
		line-height: 2;
}}

#maintext p,#maintext_r p{
	width:100%;
	max-width:100%;
	height:auto;

	animation-name: album;
	animation-duration: 10s;
	animation-iteration-count: 1;/*繰り返す回数infiniteで繰り返す*/
	animation-fill-mode:forwards;
	opacity: 0;
}

#maintext .txt1,#maintext_r .txt1{
	color:#ccc;
	display: block;
}

#maintext .txt2,#maintext_r .txt2{
	color:#333;
	position: absolute;
	top:0;
	right:0;

	animation-delay:10s;
}


/*twitter お知らせ*/
.twitter_box{
    width: 100%;/*88%;*/
    margin:10px auto;
    padding-bottom: 20px;
    margin-bottom: 0;
    /*background: #fff;*/
    /*border-radius:15px 15px 0 0;*/
    /*padding-top: 100px;*/
}

@media (max-width: 414px) {
	.twitter_box{
		width: 100%;
	}
}

.tweets {
    padding: 0px;
    margin: 0px;
    list-style: none;
}

.tweets > li {
	font-size: 0.9em;
	line-height: 3.2em;
    position: relative;
    padding: 0px 0px 0px .5em;/*0px 0px 0px 2em*/
    margin: 0px;
    /*font-size: 18px;*/
    border-bottom: dotted 1px #333 ;
}

.first_tweets {
    border-top: dotted 1px #333 ;
}

@media (max-width: 414px) {
	.tweets > li {
		line-height: 2.5em;
	}
}

.tweets > li a{
    color:#438DC4;
	text-decoration:none;
}

.tweets > li a::before {
    content: "";
    width: 7px;
    height: 7px;
    border-top: solid 2px #438DC4;
    border-right: solid 2px #438DC4;
    transform: rotate(45deg);
    position: absolute;
    right: 8px;
    bottom: 12px;
}

/*テキストとアイコン文字横並び*/
.text__icon {
  margin-left: 5px;
  margin-bottom: 3px;
  display:inline-block;
  vertical-align: middle;
  width:24px;
}

/*続きを読む*/
.more-open{
	z-index: 11!important;
}
.more-close{
	z-index: 11!important;
}

/*
.more-contents{
	height: 0;
  overflow: hidden;
}
*/

.read-more-0 label{ /* label上のカーソルをリンク時と同じタイプにする*/
  cursor: pointer;
}
.read-more-0 input{ /* inputは非表示 */
  display: none;
}
/*
.read-more-0 input ~  .more-contents {
  display: none;
}

.read-more-0 input ~ .more-close {
  display: none;
}
*/
/*
.read-more-0 input:checked ~ .more-open{
	  display: none;
}
.read-more-0 input:checked ~ .more-contents{
  display: inline;
}
*/
/* 続きを読むを押すと表示されるテキストの高さ */
/*
.read-more-0 input:checked ~ .more-contents {
	height: 600px;
}
*/

.read-more-0 input[type="checkbox"].input-go + .more-contents {
	height: 0;
	overflow: hidden;
}

.read-more-0 input[type="checkbox"].input-go:checked + .more-contents {
  height: auto;
}




/*女の子画像　slick内*/
.slick {
	/*background-color: red;*/
	margin: 0 auto;
}

.multiple-item {
	/*background-color: green;*/
    width:100%;
}

.multiple-item img{
	/*display: block;*/
	width:100%;
	max-width:100%;
	height:auto;
}

/*----------------------------------------
info page
------------------------------------------*/
/*newface info*/

.newface_flex{
	width: 100%;
	 display: flex;
	 align-items: center;
	 justify-content:space-around;
	 /*justify-content: center;*/
}

.newface_flex2{
	width: 100%;
	 display: flex;
	 align-items: center;
	 justify-content: center;
}

.newfacesp_block{
	display:contents;
}

.newface_flex a{text-decoration: none;}
.newface_flex2 a{text-decoration: none;}

.newface_inner0{
	flex-basis: 10%;
	margin: 0;
	text-align: center;
}

.newface_inner1{
	flex-basis: 35%;
	margin: 0;
	text-align: center;
}

.newface_inner2{
	flex-basis: 21%;
	text-align: center;
	margin: 0;
}

.newface_inner3{
	flex-basis: 25%;
	text-align: center;
	margin: 0;
}

.newface_inner4{
	flex-basis: 7%;
	text-align: center;
	margin: 0;
	font-size: 1.3em;
}

@media (max-width: 500px) {
	.newface_flex{display: flex;}
	.newface_inner0{width: 15%;}
	.newfacesp_block{display:block;width: 75%;}
	.newface_inner1{
		width: 100%;
		font-size: 0.8em;
	}
	.newface_inner2{
		width: 100%;
		font-size: 1.3em;
	}
	.newface_inner3{width: 100%;}
	.newface_inner4{width: 10%;}
}

.line_left{
	border-left:1px dotted #333;
}

.line_left_ps{
	border-left:1px dotted #333;
}

.line_left_sp{
	border-left:0px dotted #333;
}

.line_dotted{
	width: 90%;
	line-height: 0.3em;
	border-top: 1px dotted #333;
	margin-top: -0.2em;
	margin-bottom: -0.2em;
}

@media (max-width: 500px) {
	.line_left{
		border-left:0px dotted #333;
	}
	.line_left_sp{
		border-left:1px dotted #333;
	}
	.line_dotted{
		line-height: 0.7em;
		margin-top: 0.6em;;
		margin-bottom: 0.6em;
	}
}

.translating{
	width: 97%;
	background:rgba(255,255,255,0.55);
	margin: 0 auto;
}

/*info pageのトップ表の部分*/
.shosai_f{
	border:#444 dotted;
	border-width: 0 1px 1px 0;
}

.shosai_t{
	border:#444 dotted;
	border-width: 0 0 1px 0;
}

.shosai_rl{
	border:#444 dotted;
	border-width: 0 1px 0 1px;
}

.fixed_backk{
min-height: 100vh;
background-attachment: fixed;
background-size: cover;
background-position: center;
}

.bg-wbg{
	background: url("../img/six_whitebg.png");
}
.bg-flower{
	background: url("../img/six_flower.png");
}

#fixed_back {
	display:block;
	width:100%;
	height: 100%;
	background:url(../img/six_whitebg.png);/*固定する背景画像*/
	background-size:cover;/*背景画像のサイズを指定*/
	background-attachment: fixed;/*背景画像を固定したままにするかしないか*/
	text-align: center;
}

#fixed_back_flower {
	display:block;
	width:100%;
	height: 100%;
	background:url(../img/six_flower.png);/*固定する背景画像*/
	background-size:cover;/*背景画像のサイズを指定*/
	background-attachment: fixed;/*背景画像を固定したままにするかしないか*/
	text-align: center;
}

.fixed_back_bluerose {
	display:block;
	width:100%;
	height: 100%;
	background:url(../img/six_bluerose_bk.png);/*固定する背景画像*/
	background-size:cover;/*背景画像のサイズを指定*/
	background-attachment: fixed;/*背景画像を固定したままにするかしないか*/
	text-align: center;
}

.fixed_back_rokumeikan {
	display:block;
	width:100%;
	height: 100%;
	background:url(../img/six_system_bk.png);/*固定する背景画像*/
	background-size:cover;/*背景画像のサイズを指定*/
	background-attachment: fixed;/*背景画像を固定したままにするかしないか*/
	text-align: center;
}

.fixed_back_castle {
	display:block;
	width:100%;
	height: 100%;
	background:url(../img/six_castle.png);/*固定する背景画像*/
	background-size:cover;/*背景画像のサイズを指定*/
	background-attachment: fixed;/*背景画像を固定したままにするかしないか*/
	text-align: center;
}

.fixed_back_ingarden {
	display:block;
	width:100%;
	height: 100%;
	background:url(../img/six_ingarden.png);/*固定する背景画像*/
	background-size:cover;/*背景画像のサイズを指定*/
	background-attachment: fixed;/*背景画像を固定したままにするかしないか*/
	text-align: center;
}

#back_suzuran {
	display:block;
	position: relative;
	width:100%;
	height: auto;/*800px;100%;*/
	background:url(../img/six_suzuran.png);/*固定する背景画像*/
	background-repeat: no-repeat;
	background-size:cover;/*背景画像のサイズを指定*/
}

@media (max-width: 500px) {
	#back_suzuran {
		width:100%;
		height: auto;/*800px;100%;*/
		background:url(../img/six_suzuransp.png);/*固定する背景画像*/
		background-repeat: no-repeat;
		background-position:right;
		background-size:cover;/*背景画像のサイズを指定*/
	}
}
.boxin{
	width: 100%;
	height: 600px;
}
#suzuransuper{
	position: /*relative;*/absolute;
	top: 0;/*8%;-10px*/
	left:23%;
	/*right:0;23%*/
	display: flex;
	width: 100%;
	height: 100%;
	margin: 0;
	align-items: center;
	justify-content: center;
}

@media (max-width: 500px) {
	#suzuransuper{
	top: -5%;/*8%;-10px*/
	left:10%;
}}

.translating-box {
	background:rgba(255,255,255,0.55);/*半透明なボックス*/
	display:inline-block;
	padding: 20px;
	height: auto;
	width: 90%;
	margin: 30px auto;
	text-align: left;
}

.nontranslating-box {
	display:inline-block;
	padding: 20px;
	height: auto;
	width: 90%;
	margin: 30px auto;
	text-align: left;
}

.translating-box table{
	margin: 0 auto;
}

.translating-box p {
	/*color: #fff;*/
}

.wakka{
	width:50px;
	height:50px;
	background: url(../img/six_wa.png);
	background-repeat:no-repeat;
	background-size: contain;
	padding:8px 2px 2px 5px;
	display:inline-block;
    vertical-align: middle;
}

.wakka p{
	color:#D75D96;
	font-size:12px;
	line-height: 16px;
}
.bkpink{
	background-color: #F3D4D5;
}

/*コロナウィルス感染予防拡大*/
#corona {
	display:block;
	width:100%;
	height: 100%;
	text-align: center;
}

.corona-box {
	display:inline-block;
	padding: 20px;
	height: auto;
	width: 65%;
	/*margin: 30px auto;*/
	text-align: center;
}

.corona-box p {
	color:#293B91;
}


   .parent {
	  display: flex;
	  flex-direction:row;
	  /*justify-content: center;*/
	  justify-content: center;
	  align-items: center;

      /*background-color: #ff00ff;*/
	}
  .reparent {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: row-reverse;

	/*background-color: #ff00ff;*/
  }


  .child1 {
	flex-grow: 1;
	width: 100%;
	flex-basis: 33.3%;
	/*margin: 0 auto;*/
	/*margin-left: auto;
	margin-right: auto;*/
  }

  .child1 img{
	  width: 150px;
	  margin:20px auto 20px 150px;
  }

  .child2 {
	width: 40%;
	flex-grow: 1;
	flex-basis: 40%;
	color:#293B91;
	text-align: left;
  }

  .child2 p{
	/*margin:20px 150px 30px 10px;*/
	line-height: 2.2em;
  }


@media (max-width: 500px) {
	.parent {
		display: block;
	}
	.child1 img{
  	  width: 150px;
  	  margin:20px auto;
    }
	.child2 {
	  width: 80%;
		margin: 20px auto;
}}

#supertext_info1{
  position: absolute;
  top: 0;
  right:0;
  display: flex;
  width: 100%;
  height: 100%;
  margin: 0;
  padding:50px;
  align-items: center;
  justify-content: center;
}

@media (max-width: 500px) {
	#supertext_info1{
		top: 30%;
		left:10%;
		display: block;
		padding:5%;
	}
}

#supertext_info{
  position: absolute;
  top: 0;
  right:0;
  display: flex;
  width: 100%;
  height: 100%;
  margin: 0;
  padding:50px;
  align-items: center;
  justify-content: center;
}

@media (max-width: 500px) {
	#supertext_info{
		display: block;
		padding:5%;
	}
}

.mailmag{
	color:#293B91;
}

.title{
	font-size: 1.5em;
}

@media (max-width: 500px) {
	.title{
		font-size: 1.3em;
	}
}

.info_inner1{
	width: 33%;
	/*flex-growの値 flex-shrinkの値 flex-basisの値*/
	flex:0 1 25%;
	margin: 0;
}
.info_inner1 img{
	width:100%;
	max-width:100%;
	height:auto;
}

.info_inner2{
	width: 50%;
	/*flex-growの値 flex-shrinkの値 flex-basisの値*/
	flex:0 1 50%;
	margin:0;
}

@media (max-width: 500px) {

	.info_inner1{
		width:50%;
		margin: 20px auto;
	}
	.info_inner2{
		width:80%;
		margin: 20px auto;
	}
}

/*深海画像上下スクロール 背景の横移動*/
#infovisual {
    width: 100%;
    height: 400px;/*540px*/
    background: url(../img/six_deepsea.png);
    background-position: 0 0;
	background-size:auto;
    -webkit-animation: bgroop 20s linear; /*infinite;*/
    animation: bgroop 20s linear;/* infinite;*/
	animation-fill-mode: forwards;
}
@-webkit-keyframes bgroop {
    from {
        background-position: 0  -200px;
    }
    to {
        background-position: 0 -800px;
    }
}
@keyframes bgroop {
    from {
        background-position: 0 -200px;
    }
    to {
        background-position: 0 -800px;
    }
}

/*女性左右スクロール 背景の横移動*/
#lady {
    width: 100%;
    height: 400px;/*540px*/
    background: url(../img/six_lady.png);
    background-position: 0 0;
	background-size:auto;
    -webkit-animation: ladyroop 20s linear;/* infinite;*/
    animation: ladyroop 20s linear;/*infinite;*/
	animation-fill-mode: forwards;
}
@-webkit-keyframes ladyroop {
    from {
        background-position: 0 0;/*0 0*/
    }
    to {
        background-position: -100px 0;/*-200 0*/
    }
}
@keyframes ladyroop {
    from {
        background-position: 0 0;
    }
    to {
        background-position: -100px 0;
    }
}

.three-item {
	/*background-color: red;*/
    width:100%;
}

.three-item img{
	/*display: block;*/
	width:100%;
	max-width:100%;
	height:auto;
}


/*女の子　１枚　＆　３枚写真様CSS*/
   .girl-flex {
	  display: flex;
	  flex-direction:row;
	  /*justify-content: center;*/
	  justify-content: space-around;
	  align-items: flex-start;/*center;*/

      /*background-color: #ff00ff;*/
	}

@media (max-width: 899px) and (min-width: 501px) {
	.girl-flex {
 	  display: flex;
 	  flex-direction:row;
 	  /*justify-content: center;*/
 	  justify-content: space-around;
 	  align-items: flex-start;/*center;*/
 	}
}

	@media (max-width: 501px) {
		.girl-flex {
	  	 display: flex;
	  	 flex-direction:column;
	  	 /*justify-content: center;*/
	  	 justify-content: center;
	  	 align-items: center;
	     }
	}


.ccustom {
	width: 30%;
	/*width:250px;*/
}

@media (max-width: 899px) and (min-width: 501px) {
	.ccustom {
		width:39%;/*42%*/
	}
}

@media (max-width: 501px) {
	.ccustom {
		width:90%;
		margin-left: 3%;
		margin-right: 3%;
		margin-top: 20px;
	 }
}


	.ccustom_back{
		display: none;
	}

	@media (max-width: 899px) and (min-width: 501px) {
		.ccustom_back{
			display: block;
			width: 90%;
			height: auto;
			position: absolute;
			top:40%;
			left:30%;/*9% 0 20%*/
			opacity: 0.3;/*0.1*/
		}
	}


  .girl1 {
	 /*flex-growの値 flex-shrinkの値 flex-basisの値*/
	 width: 22%;
	 flex:0 1 22%;
	 margin-right: 50px;
	/*flex-grow: 1;
	flex-basis: 22%;*/
	/*margin: 0 auto;*/
	/*margin-left: auto;
	margin-right: auto;*/
  }

  .girl1 img{
	  margin:0 auto;
	  width:100%;
	  max-width:100%;
	height:auto;
  }

  .girl2 {
	  margin-top: 30px;
	  margin-bottom: auto;
	  width: 66%;
	  /*flex-growの値 flex-shrinkの値 flex-basisの値*/
	  flex:0 1 66%;
	/*flex-grow: 1;
	flex-basis: 66%;*/
  }

  .girl2 img{
	margin:0 auto;
	width:100%;
	max-width:100%;
	height:auto;
  }


@media (max-width: 500px) {
	.girl1 {
		margin:0 auto;
  	 /*flex-growの値 flex-shrinkの値 flex-basisの値*/
  	 width: 40%;
  	 flex:0 1 40%;
  	 /*margin-right: 50px;*/
 }
	.girl2{
		margin:0 auto;
		margin-top: 30px;
	width:40%;
	flex:0 1 40%;
	/*margin:10px auto;*/
	/*font-size:0.9em;
	line-height: 2.0em;*/
	}
}

.text-bg_girl{
  display: inline-block;
  font-size: 1em;
  font-weight: normal;
  line-height: 1.4em;
  margin-top: 13px;/*追加*/
  margin-left:4%;
  padding: 5px 8px;
  background:#172A88;
  color:#fff;
}

.text_girl{
  display: inline-block;
  font-size: 0.9em;
  font-weight: normal;
  line-height: 1.4em;
  margin-top: 13px;/*追加*/
  margin-left:4%;
  padding: 5px 8px;
  color:#172A88;
}

.text-bg_girl2{
  display: inline-block;
  font-size: 1em;
  font-weight: normal;
  line-height: 1.4em;
  margin-top: 13px;/*追加*/
  margin-left:4%;
  padding: 5px 8px;
  background:#3584bb;
  color:#fff;
}


/*女の子詳細ページ details.html CSS*/
.details_back {
	background-color: #D8ECF9;
}




.details_topin_outer{
	position: relative;
	width:100%;
	margin-top: 60px;
}
@media (max-width: 500px) {
	.details_topin_outer{
		margin-top: 0;
		position: relative;
		/*position:static;*/
		width:100%;
		/*height: auto;*/
	}

}


.details_left_in2{
	margin-top: 60px;
	width: 400px;
	/*height: 120px;*/
	z-index: 10;
}

.details_left_in2 img{
	width:100%;
	max-width:100%;
	height:auto;
}

@media (max-width: 501px) {
	.details_left_in2{
		width:80%;
		margin-left:10%;
		/*height:auto;*/
		/*height: auto;*/
	}
}

.details_left_in2 img{
	width:100%;
	max-width:100%;
	height:auto;
	z-index: 11;
}


#thumbnail-list {
    margin:20px auto;
    width:100%;
    display: flex;
}

.thumbnail-item{
	flex: 0 1 25%;
	margin-bottom: 10px;
  	box-sizing: border-box;
  	position:relative;
  &:after{
    content:'';
    background-color: rgba(0,0,0,0.5);
    position:absolute;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 1;
    transition: .3s opacity linear;
  }
  &.thumbnail-current:after{
    opacity: 0;
  }
  img{
    width: 100%;
    margin: 0 auto;
  }
}















/*------------------------------------------------
ここから  slick
------------------------------------------------*/

/* 僅かに出る横スクロールを直せないので */
.sliderbox {
    overflow: hidden;
}

/* slickの初期化完了まで非表示 */
.slider,
.slider-thumb {
  display:none;
}
.slider.slick-initialized,
.slider-thumb.slick-initialized {
  display: block;
}

/* カルーセル画像 */
.slider img {
    width: 100%;
    height: auto;
}

/* サムネイル */
.slider-thumb {
	margin-top: 0;/*-150px;*/
	width:500px;
    max-width: 1200px;
    margin-right: auto;
    margin-left: -50px;
}

.slider-thumb img {
    width: 100%;
    height: auto;
}

.slider-thumb .slick-slide a {
    display: block;
    margin: 20px 3px;/*20PX 5PX*/
}

.slider-thumb .slick-current img{
	outline:1px solid #172A88;
	outline-offset: -1px;
}

.slider-thumb .slick-track {
transform:unset!important;
}


/*------------------------------------------------
ここから  slick-theme_def.cssの内容をカスタマイズ
デフォルト設定はslick-theme.cssにある。
.slick-prev .slick-nextの矢印設定をカスタマイズ
------------------------------------------------*/

/* Slider */
.slick-loading .slick-list
{
    background: #fff url('./ajax-loader.gif') center center no-repeat;
}

/* Icons */
@font-face
{
    font-family: 'slick';
    font-weight: normal;
    font-style: normal;

    src: url('./fonts/slick.eot');
    src: url('./fonts/slick.eot?#iefix') format('embedded-opentype'), url('./fonts/slick.woff') format('woff'), url('./fonts/slick.ttf') format('truetype'), url('./fonts/slick.svg#slick') format('svg');
}
/* Arrows */
.slick-prev,
.slick-next
{
    font-size: 0;
    line-height: 0;

    position: absolute;
    top: 50%;

    display: block;

    width: 20px;
    height: 20px;
    padding: 0;
    /*-webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);  削除*/

    cursor: pointer;

    color: transparent;
    border: none;
    outline: none;
    /*background: transparent; 削除*/
}

.slick-prev{/*追加*/
    background: url(../img/six_arrow_l.png);
    background-repeat:no-repeat;
    background-size: 20px 20px;
}

.slick-next{/*追加*/
    background: url(../img/six_arrow_r.png);
    background-repeat:no-repeat;
    background-size: 20px 20px;
}

.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus
{
    /*color: transparent;
    outline: none;
    background: transparent;削除*/
    opacity: 0.5;
}
.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before
{
    opacity: 1;
}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before
{
    opacity: .25;
}

.slick-prev:before,
.slick-next:before
{
    font-family: 'slick';
    font-size: 20px;
    line-height: 1;

    opacity: .75;
    /*color: white;削除*/

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.slick-prev
	{
	    left: 10px;/*-25px;*/
	}

[dir='rtl'] .slick-prev
{
    right: -25px;
    left: auto;
}
.slick-prev:before
{
    /*content: '←';削除*/
}
[dir='rtl'] .slick-prev:before
{
    /*content: '→';削除*/
}

.slick-next
{
    right: -25px;
}
[dir='rtl'] .slick-next
{
    right: auto;
    left: -25px;
}
.slick-next:before
{
    /*content: '→';削除*/
}
[dir='rtl'] .slick-next:before
{
    /*content: '←';*/
}

/* Dots */
.slick-dotted.slick-slider
{
    margin-bottom: 30px;
}

.slick-dots
{
    position: absolute;
    bottom: -25px;/*-25px*/

    display: block;

    width: 100%;
    padding: 0;
    margin: 0;

    list-style: none;

    text-align: center;
}
.slick-dots li
{
    position: relative;

    display: inline-block;

    width: 20px;
    height: 20px;
    margin: 0 5px;
    padding: 0;

    cursor: pointer;
}
.slick-dots li button
{
    font-size: 0;
    line-height: 0;

    display: block;

    width: 20px;
    height: 20px;
    padding: 5px;

    cursor: pointer;

    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus
{
    outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before
{
    opacity: 1;
}
.slick-dots li button:before
{
    font-family: 'slick';
    font-size: 6px;
    line-height: 20px;

    position: absolute;
    top: 0;
    left: 0;

    width: 20px;
    height: 20px;

    content: '•';
    text-align: center;

    opacity: .25;
    color: black;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before
{
    opacity: .75;
    color: black;
}


/*.sliderの　矢印のみ*/
.slider .slick-next {
    right: -25px;/*-56px -50px*/
}
/*.sliderの　矢印のみ*/
.slider .slick-prev {
    left: -25px;/*-25px*/
}




@media screen and (max-width: 500px) {
	.slick-prev{/*追加*/
	    background: url(../img/six_prev_btn.png);
		background-size: 24px 148px;
	    background-repeat:no-repeat;
	}

	.slick-next{/*追加*/
	    background: url(../img/six_next_btn.png);
		background-size: 24px 148px;
	    background-repeat:no-repeat;
	}


	.slider .slick-prev,
	.slider .slick-next
	{
		width: 24px;
		height: 148px;
	}

	.slider .slick-next
	{
		background-color: rgba(23,42,136,0.5);
		/*position: relative;
		background: url(../img/six_next_btn.png);*/
	    background-repeat:no-repeat;
		/*background-image:none;*/
	    background-size: 24px 148px;
		z-index: 70;
		right: 0;/*5px; -25px;*/
	}

	.slider .slick-prev
    {
		background-color: rgba(23,42,136,0.5);
		/*position: relative;
		background: url(../img/six_prev_btn.png);*/
	    background-repeat:no-repeat;
		/*background-image:none;*/
	    background-size: 24px 148px;
		z-index: 70;
        left: 0;/*5px;-19px -25px;*/
    }
/*
	.slider .slick-next::before{
		content: '';
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		background-color: rgba(23,42,136,0.7);
		}

	.slider .slick-prev::before{
		content: '';
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		background-color: rgba(23,42,136,0.7);
		}
*/
	.slider .slick-dots{
		z-index: 99;
		bottom: 30px;
	}

	.slick-dots li button:before {
    color: #7FD2FB;
	}

	.slick-dots li.slick-active button:before {
    color: #038AD1;
	}
}

@media (max-width: 899px) and (min-width: 501px) {
	.slider .slick-dots{
		z-index: 99;
		bottom: 30px;
	}

	.slick-dots li button:before {
    color: #7FD2FB;
	}

	.slick-dots li.slick-active button:before {
    color: #038AD1;
	}
}

/*------------------------------------------------
end of slick-theme .slick-prev .slick-next
------------------------------------------------*/

.details_right_inopen{
	width: 285px;
	height: 50px;
	/*position: absolute;
	top:900px;
	left:20%;*/
	/*padding:4%;
	margin-top:120px;
	padding:0 100px 0 50px;
	padding-left: 100px;*/
	color:#293B91;
	text-align: left;
	/*background: url(../img/six_custom_bk1.png);
	repeat:no-repeat;
	background-size: cover;
	background-position:top;*/
	line-height: 2.3em;
	z-index: 1;
}
@media (max-width: 500px) {
	.details_right_inopen{
		position:static;
		width:100%;
		/*height: auto;*/
	}

}

.details_right_inclose{
	width: 285px;
	height: 50px;
	/*position: absolute;
	top:1500px;
	left:20%;
	padding:4%;*/
	/*margin-top:120px;
	padding:0 100px 0 50px;
	padding-left: 100px;*/
	color:#293B91;
	text-align: left;
	/*background: url(../img/six_custom_bk1.png);
	repeat:no-repeat;
	background-size: cover;
	background-position:top;*/
	line-height: 2.3em;
	z-index: 1;
}
@media (max-width: 500px) {
	.details_right_inclose{
		position:static;
		width:100%;
		/*height: auto;*/
	}

}



.blueback{
	margin-top: 0.7em;
	margin-bottom: 0.7em;
	padding:0.5em 0.5em;
	line-height: 1;
	background-color: #60A4D6;
	color:#fff;
}

.orangeback{
	margin-top: 0.7em;
	margin-bottom: 0.7em;
	padding:0.5em 0.5em;
	line-height: 1;
	background-color:#ffa75e;
	color:#fff;
}

.orangeback2{
	margin-top: 0.7em;
	margin-bottom: 0.7em;
	padding:0.5em 0.5em;
	line-height: 1;
	background-color:#fdcf9d;
	color:#fff;
}


@media (max-width: 899px) and (min-width: 501px) {
	.details_right_in2 .blueback,.details_right_in2 .orangeback{
		/*margin-left: 3%;*/
		margin-top: 0.5em;
		margin-bottom: 0.5em;
		padding-left: 0.5em;
		padding-right: 0.5em;
		display: inline-block;
		z-index: 4!important;
	}
	.ccustom .blueback,.ccustom .orangeback{
		/*margin-left: 3%;*/
		margin-top: 0.5em;
		margin-bottom: 0.5em;
		padding-left: 0.5em;
		padding-right: 0.5em;
		display: inline-block;
		z-index: 4!important;
	}
}

@media (max-width: 500px) {
	.details_right_in2 .blueback,.details_right_in2 .orangeback{
		/*margin-left: 3%;*/
		margin-top: 0.5em;
		margin-bottom: 0.5em;
		padding-left: 0.5em;
		padding-right: 0.5em;
		display: inline-block;
		z-index: 4!important;
	}
	.ccustom .blueback,.ccustom .orangeback{
		/*margin-left: 3%;*/
		margin-top: 0.5em;
		margin-bottom: 0.5em;
		padding-left: 0.5em;
		padding-right: 0.5em;
		display: inline-block;
		z-index: 4!important;
	}
}

.continue{
	margin-top:0;/* 2em;*/
	margin-bottom: 0.7em;
	padding: 7px auto;
	line-height: 2.4em;
	border: 1px solid #293B91;
}

.girlphoto{
	position:absolute;
	width:40%;
	/*height:auto;*/
}

.girlphoto img{
	width:100%;
	max-width:100%;
	height:auto;
}

.schedule_flex{
	width: 100%;
	 display: flex;
	 align-items: center;
	 justify-content:space-evenly;/*space-around;space-between;*/
	 flex-wrap: nowrap;
}

@media (max-width: 500px) {
	.schedule_flex{
		flex-wrap: wrap;
	}
}

.sch_inline{
	width: 100%;
	text-align: center;
}

@media (max-width: 500px) {
	.sch_inline{
		width: 32%;
		margin:7px auto;
	}
}

.img-wrap {
  overflow: hidden;
  position: relative;
}

.img-wrap:before {
  animation: img-wrap 5s cubic-bezier(.4, 0, .2, 1) forwards;
  background:url(../img/six_bluesea_bk_rhalf.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  bottom: 0;
  content: '';
  left: 0;
/*
  pointer-events: none;
*/
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1;
}

@keyframes img-wrap {
  100% {
    transform: translateY(100%);
  }
}

.is-animated_box{
	position: relative;
}

.is-animated {
	animation: slideIn 3s cubic-bezier(0.25, 1, 0.5, 1) 1 forwards;

	opacity: 0;
	position: absolute;
	top:0;
	left:0;

	animation-delay:3s;
}

.is-animated2 {
  /*animation: slideIn 3s cubic-bezier(0.25, 1, 0.5, 1) 1 forwards;*/
  animation: slideRL 6s cubic-bezier(0.25, 1, 0.5, 1) 1 forwards;
  /*animation-delay:3s;*/
}

@keyframes slideIn {
  0% {
    transform: translateY(180px);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
  }
  40%,100% {
    opacity: 1;
  }
}

@keyframes slideRL {
	0% {
      transform: translateY(180px);
      opacity: 0;
    }
    50% {
      transform: translateX(0);
    }

  100% {
	transform: translateX(-400px);
    opacity: 1;
  }
}

/*スクロールバー*/
.whitetextbox::-webkit-scrollbar {
  /*width: 18px;*/
}
.whitetextbox::-webkit-scrollbar-track {
  /*background: #fff; #c2e7f2;*/
  /*border-radius: 3px;*/
}
.whitetextbox::-webkit-scrollbar-thumb {
  /*background: url(../img/six_scrollbarimg.png);#015EA4;
  background-repeat: no-repeat;
  border-radius: 3px;*/
}

.mess_title{
	position:absolute;
	top:-20px;
	left:65%;
}

@media (max-width: 899px) and (min-width: 501px) {
	.mess_title{
		position:absolute;
		width: 40%;
		top:-20px;
		left:55%;
	}
}

@media (max-width: 500px) {
	.mess_title{
		position:static;
		width:96%;
		margin: 0 auto 0 3%;/*0=-20px auto 0 3%;*/
		height: 100%;/*auto*/
	}
}

.bluesea{
	position:absolute;
	width:800px;
	height:600px;
	top:120px;
	right:3%;
	opacity:1;
}

@media (max-width: 500px) {
	.bluesea{
		/*position:static;*/
		top:150px;
		width:70%;
		margin:0 0 0 auto;/*0 3% 0 auto;*/
		height: auto;
	}
}

.bluesea img{
	width:100%;
	max-width:100%;
	height:auto;
}

.bluesea_girl{
	position:absolute;
	width: 400px;
	height:600px;
	top:120px;
	right:3%;
	opacity:1;
}

@media (max-width: 500px) {
	.bluesea_girl{
		width:70%;
		top:150px;
		margin:0 0 0 auto;/*0 3% 0 auto;*/
		height: auto;
	}
}

.bluesea_girl img{
	width:100%;
	max-width:100%;
	height:auto;
}

.profbox{
	color:#2B333B;
	font-weight: bold;
	position:absolute;
	width:275px;
	height:250px;
	top:405px;/*515px*/
	right:7%;
	z-index:9;
}

@media (max-width: 500px) {
	.profbox{
		width:63%;/*70%;*/
		top:190px;/*140px*/
		/*right:26%;26% 15%*/
		left:3%;
		height: auto;
	}
}

.whiteprofbox{
	width:100%;
	padding:3%;
	background-color:rgba(255,255,255,.6);
	z-index:10;
}

.whitetextbox{
	position:relative;
	top:0;
	left:0;
	width:48%;
	height: 1100px;
	overflow-y: scroll;
	margin-left: 4%;
	padding:60px 60px;
	background-color:rgba(255,255,255,.8);
}

@media (max-width: 500px) {
	.whitetextbox{
		/*position:static;*/
		width:83%;
		top:280px;/*250px*/
		padding:30px 30px;
		/*right:10%;*/
		height: 700px;
		z-index: 2;
	}
}

.whitetextbox p{
	line-height:2.4em;
}

.rireki{
	position:absolute;
	top:850px;
	left:62%;
	font-size:2.4em;
	line-height:2.4em;
}

@media (max-width: 500px) {
	.rireki{
		position:static;
		width:94%;
		margin: 300px 2% -50px 4%;
		height: auto;
                pointer-events: auto;
		z-index: 2;

		/*line-height: 1em;*/
	}
}

.schedule_whitebox{
	width:100%;
	padding:20px;
	background-color:#fff;
}

@media (max-width: 500px) {
	.schedule_whitebox{
		width:94%;
		margin:0 3% 0 auto;
		height: auto;
		/*overflow: hidden;*/
	}
}


.companion_flex{
	width: 100%;
	 display: flex;
	 position:relative;
	 align-items: center;
	 justify-content:space-evenly;/*space-around;space-between;*/
	 flex-wrap: wrap;
}

.companion_inwhite{
	background-color:rgba(255,255,255, 0.5);
	width:24%;
	margin-top:20px;

	height: 380px;
}

@media (max-width: 500px) {
.companion_inwhite{
	width:45%;
}}

.schdule_inwhite{
	position: relative;
	background-color:rgba(255,255,255, 0.5);
	width:24%;
	margin-top:20px;
	height: 380px;
}

.schdule_inner1{
	position:absolute;
	top:59%;
	left:19%;
	display: inline-block;
	border:1px solid #015EA4;
	font-size: 1em;
	font-weight: normal;
	line-height: 1.4em;
	margin-top: 13px;/*追加*/
	margin-left:4%;
	padding: 5px 8px;
	color:#015EA4;
}

@media (max-width: 500px) {
	.schdule_inner1{
	top:59%;
	left:3%;
}}

.details_inner1{
	width:30%;/*59%;53%;*/
	text-align: center;
	display: inline-block;
	border:1px solid rgba(23,42,136,1);/*#015EA4;*/
	font-size: 2em;/*1em;*/
	line-height: 1;/*1.4em;*/
	padding: 3px 8px;/*5px 8px;*/
	color:rgba(23,42,136,1);/*#015EA4;*/
	background-color:rgba(255,255,255, 0.5);/*追加*/
}
.details_inner3{
	width:30%;/*53%;*/
	text-align: center;
	display: inline-block;
	border:1px solid rgba(230,81,169,1);/*red;*/
	font-size: 2em;/*0.9em;*/
	line-height: 1;
	padding: 3px 8px;/*5px 8px;*/
	color:rgba(230,81,169,1);/*red;*/
	background-color:rgba(255,255,255, 0.5);/*追加*/
}

.schdule_inner2{
	position:absolute;
	top:59%;
	left:19%;
	display: inline-block;
	border:1px solid red;
	font-size: 1em;
	font-weight: normal;
	line-height: 1.4em;
	margin-top: 13px;/*追加*/
	margin-left:4%;
	padding: 5px 8px;
	color:red;
}

@media (max-width: 500px) {
	.schdule_inner2{
	top:59%;
	left:3%;
}}

.schdule_inner_stmp{
	position:absolute;
	top:65%;
	right: -9%;
	width:120px;
	height: 120px;
}

@media (max-width: 500px) {
	.schdule_inner_stmp{
	top:-10%;
	left:30%;
}}

.schdule_inner_stmp img{
	width:100%;
	max-width:100%;
	height:auto;
}

.compa_title{
margin: 15px auto;
color:#fff;
background-color: #015EA4;
text-align: center;
}

.compa_prof{
	margin:0 auto;
	color:#015EA4;
	text-align: center;
}

.compa_prof2{
	margin:15px auto;
	color:#293B91;
	text-align: center;
}

.compa_inbox{
	margin:15px auto;
	width: 170px;
}
.compa_inbox img{
	width:100%;
	max-width:100%;
	height:auto;
}

.schedule_inbox{
	margin:30px auto;
	width: 170px;
}
.schedule_inbox img{
	width:100%;
	max-width:100%;
	height:auto;
}







/*------------------
form
-----------------------*/
.m-form-text {
    height: 2.4em;
    width: 100%;/*100%;*/
    padding: 0 16px;
    border-radius: 4px;
    border: none;
    box-shadow: 0 0 0 1px #ccc inset;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.m-form-text:focus {
    outline: 0;
    box-shadow: 0 0 0 2px rgb(33, 150, 243) inset;
}

.m-form-select {
    position: relative;
	display: inline-block;
	width:30%;
}

.m-form-select:before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    right: 12px;
    width: 8px;
    height: 8px;
    border-top: 2px solid #333;
    border-right: 2px solid #333;
    transform: rotate(135deg);
/*
    pointer-events: none;
*/
}

.m-form-select select {
    height: 2.4em;
    width: 100%;/*100%;*/
    padding: 0 8px;
    border-radius: 4px;
    border: none;
    box-shadow: 0 0 0 1px #ccc inset;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    cursor: pointer;
}

.m-form-select select::-ms-expand {
    display: none;
}

.m-form-select select:focus {
    outline: 0;
    box-shadow: 0 0 0 2px rgb(33, 150, 243) inset;
}

.m-form-submit-button {
    display: inline-block;
    width: 100%;/*100%;*/
    padding: 8px;
    border: none;
    border-radius: 4px;
    background-color: #333;
    color: #fff;
    font-weight: bold;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    cursor: pointer;
    border: 2px solid transparent;
}

section {
  max-width: 300px;
  margin: 0 auto;
  display: inline-block;/*追加*/
}

@media (max-width: 500px) {
	section {margin-top: 16px;}
}

a.btn_06-2 {
  display: block;
  color: #ffffff;
  font-size: 20px;
  font-weight: bold;
  line-height: 1.2;
  text-decoration: none;
  text-align: center;
  padding: 0.2em 2em;/*1.3em .5em;*/
  background: rgba(0, 0, 0, 0.2);
  border: 1px solid transparent;
  border-radius: 6px;
  box-sizing: border-box;
  max-width: 360px;
  margin: 0 auto;
  position: relative;
}
a.btn_06-2 span {
  position: relative;
  display: block;
  transform: translate(-3px, -3px);
  transition: 0.3s;
  z-index: +1;
}
a.btn_06-2:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  margin: auto;
  width: 100%;
  height: 100%;
  background: #1E2083;
  border-radius: 6px;
  box-sizing: border-box;
  transform: translate(-3px, -3px);
  transition: 0.3s;
}
a.btn_06-2:hover span {
  transform: translate(0, 0);
}
a.btn_06-2:hover:after {
  transform: translate(0, 0);
}
@media all and (max-width: 1023px) {
  a.btn_06-2 {
    font-size: 18px;
  }
}
@media all and (max-width: 767px) {
  a.btn_06-2 {
    font-size: 16px;
  }
}
