@charset "utf-8";

/******************************

 * parts style
 *
 * 1. title
 * 2. parts

******************************/

/*****
 * 1. title
*****/

	.bg-black01 .headline,
	.bg-black02 .headline,
	.bg-green .headline,
	.bg-black01 .cmt,
	.bg-black02 .cmt,
	.bg-green .cmt{
		color:#fff;
	}

	.headline {
		display: block;
	}
	/*headline-01*/
	.headline.headline-01 {
		font-size: 12px;
		text-align: center;
		letter-spacing: 0.35em;
	}
	.headline.headline-01 span{
		display: block;
		font-size: 21px;
		font-family: 'EB Garamond', serif;
		letter-spacing: 0.25em;
	}
	/*headline-02*/
	.headline.headline-02 {
		font-size: 30px;
		text-align: center;
		letter-spacing: 0.2em;
		line-height: 2.2;
	}
	/*headline-03*/
	.headline.headline-03 {
		font-size: 26px;
		text-align: center;
		letter-spacing: 0.2em;
		line-height: 2.2;
	}
	.headline.headline-03 + .cmt{
		text-align: center;
	}
	.headline.headline-01 + .headline.headline-03{
		margin-top: 75px;
	}
	/*headline-04*/
	.headline.headline-04 {
		font-size: 22px;
		letter-spacing: 0.2em;
		line-height: 2.2;
	}
	/*headline-05*/
	.headline.headline-05 {
		font-size: 18px;
		letter-spacing: 0.2em;
		line-height: 2;
	}
	.headline.headline-05 strong{
		font-size: 22px;
	}
	.headline.headline-05 strong.num{
		font-size: 27px;
	}
	.headline.headline-05 + .cmt{
		font-size: 10px;
		color: #999999;
		margin-top: 0;
		letter-spacing: 0.15em;
		line-height: 2;
	}
	/*headline-06*/
	.headline.headline-06 {
		font-size: 14px;
		letter-spacing: 0.2em;
		line-height: 1.2;
	}
	.headline.headline-06 + .cmt{
		font-size: 10px;
		color: #999999;
		margin-top: 0;
	}
	.headline.headline-07{
		font-size: 24px;
		margin-bottom: 60px;
	}
	.headline.headline-08{
		font-size: 26px;
		letter-spacing: 0.2em;
		line-height: 2.2;
	}
	.headline.headline-08 + .cmt{
		font-size: 16px;
	}
	.cmt{
		font-size: 14px;
		line-height: 2.6;
		margin-top: 40px;
	}
	.cmt strong{
		font-size: 16px;
	}

	.headline + .btn {
		margin-top: 35px;
	}
	@media only screen and (max-width:768px) {
		/*headline-01*/
		.headline.headline-01 span{
			font-size: 20px;
		}
		/*headline-02*/
		.headline.headline-02 {
			font-size: 24px;
		}
		/*headline-03*/
		.headline.headline-03 {
			font-size: 22px;
			line-height: 2.2;
		}
		.headline.headline-01 + .headline.headline-03{
			margin-top: 75px;
		}
		/*headline-04*/
		.headline.headline-04 {
			font-size: 20px;
			line-height: 2.2;
		}
		/*headline-05*/
		.headline.headline-05 {
			font-size: 16px;
			line-height: 2.2;
		}
		.headline.headline-05 strong{
			font-size: 18px;
		}
		.headline.headline-05 strong.num{
			font-size: 22px;
		}
		/*headline-06*/
		.headline.headline-06 {
			font-size: 13px;
			line-height: 1.2;
		}
		/*headline-07*/
		.headline.headline-07{
			font-size: 18px;
			margin-bottom: 30px;
		}
		/*headline-08*/
		.headline.headline-08{
			font-size: 22px;
		}
		.headline.headline-08 + .cmt{
			font-size: 13px;
		}
		.cmt{
			font-size: 13px;
			line-height: 2.6;
			margin-top: 40px;
		}
		.cmt strong{
			font-size: 14px;
		}
	}

/*****
 * 2. parts
*****/
/*mainVisual*/
.mainVisual {
	width: 100%;
	min-height: 100vh;
	background-image: url(../imgs/bg-01.gif);
	background-repeat: repeat;
	background-size: cover;
	background-position: center;
    box-sizing: border-box;
    position: fixed;
    left: 0;
    top: 0;
    z-index: -2;
}
.mainVisual .wrap{
}
.mainVisual-inner{
	width: 360px;
	position: absolute;
	left: 0;
	right: 0;
	top:45%;
	-webkit-transform: translateY(-45%); /* Safari用 */
	transform: translateY(-45%);
	margin:auto;
	text-align:center;
}
.mainVisual-img{
	width: 360px;
	height: 360px;
	border-radius: 50%;
	overflow: hidden;
	z-index: 1;/*マスクに必要*/
}
.mainVisual-img span img{
	max-width: 360px;
}
.mainVisual-img span{
	display: block;
	min-width: 100%;
	min-height: 100%;
	border-radius: 50%;
}
.mainVisual-img span img{
	transform: scale(1.1);
}
.mainVisual-img span.zoomout img{

	-webkit-animation: cntxtlAnim 2.0s ease 0s 1 forwards;/*表示時間+start時間*/
	animation: cntxtlAnim 2.0s ease 0s 1 forwards;/*表示時間+start時間*/
}
@-webkit-keyframes cntxtlAnim {
	100% {
	    transform: scale(1.0);
	}
}
@keyframes cntxtlAnim {
	100% {
	    transform: scale(1.0);
	}
}
.mainVisual-img .caption{
	left: 0;
	right: 0;
	bottom: 20px;
	margin:auto;
	text-align: center;
}
.mainVisual-txt{
	margin:50px auto 0;
/*	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	　text-orientation: upright;
	font-size: 20px;
	text-align: left;
	line-height: 2.6;
	letter-spacing: 0.3em;*/
	opacity: 0;

	-webkit-filter: blur(5px);
	filter: blur(5px);
	transform: scale(1.1);
}
.mainVisual-txt.fadein{

	-webkit-animation: mvtxtAnim 2.0s ease 0.5s 1 forwards;/*表示時間+start時間*/
	animation: mvtxtAnim 2.0s ease 0.5s 1 forwards;/*表示時間+start時間*/
}
@-webkit-keyframes mvtxtAnim {
	100% {
		opacity: 1;
		-webkit-filter: blur(0px);
		filter: blur(0px);
		transform: scale(1.0);
	}
}
@keyframes mvtxtAnim {
	100% {
		opacity: 1;
		-webkit-filter: blur(0px);
		filter: blur(0px);
		transform: scale(1.0);
	}
}
/*@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	.mainVisual-txt{
		letter-spacing: 0.2em;
	}
	.tate-cho{
	    text-align: center;
	    display: inline-block;
	   -moz-transform: matrix(0, 1, 1, 0, 0, 0);
	-webkit-transform: matrix(0, 1, 1, 0, 0, 0);
	    -o-transform: matrix(0, 1, 1, 0, 0, 0);
	    transform: matrix(0, 1, 1, 0, 0, 0);
	    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1, mirror=1);
	}
	.kakko-top{
	    text-align: center;
	    display: inline-block;
	   -moz-transform: matrix(0, 1, -1, 0, 0, 0);
	-webkit-transform: matrix(0, 1, -1, 0, 0, 0);
	    -o-transform: matrix(0, 1, -1, 0, 0, 0);
	    transform: matrix(0, 1, -1, 0, 0, 0);
	    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1, mirror=1);	
	}
	.kakko-bottom{
	    text-align: center;
	    display: inline-block;
	   -moz-transform: matrix(0, 1, -1, 0, 0, 0);
	-webkit-transform: matrix(0, 1, -1, 0, 0, 0);
	    -o-transform: matrix(0, 1, -1, 0, 0, 0);
	    transform: matrix(0, 1, -1, 0, 0, 0);
	    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1, mirror=1);	
	}
	.kuto-ten{
	    text-align: center;
	    display: inline-block;
	   -moz-transform: matrix(0, 1, 1, 0, 1, 0);
	-webkit-transform: matrix(0, 1, 1, 0, 1, 0);
	    -o-transform: matrix(0, 1, 1, 0, 1, 0);
	    transform: matrix(0, 1, 1, 0, 1, 0);
	    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1, mirror=1);
	}
	.kuto-maru{
	    text-align: center;
	    display: inline-block;
	   -moz-transform: matrix(0, 1, 1, 0, 0, 0);
	-webkit-transform: matrix(0, 1, 1, 0, 0, 0);
	    -o-transform: matrix(0, 1, 1, 0, 0, 0);
	    transform: matrix(0, 1, 1, 0, 0, 0);
	    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1, mirror=1);
	}

}*/

@media only screen and (max-width:768px) {
	.mainVisual-inner{
		width: 190px;
		top:40%;
		-webkit-transform: translateY(-40%); /* Safari用 */
		transform: translateY(-40%);
	}
	.mainVisual-img{
		width: 190px;
		height: 190px;
	}
	.mainVisual-img span img{
		max-width: 190px;
	}
	.mainVisual-txt{
		width: 66%;
		/*font-size: 16px;*/
		margin:30px auto 0;
	}
	.mainVisual-txt img{
		width: 100%;
	}
}


/*---------------
section
----------------*/
.section{
	padding:100px 0 130px;
	background: #fff;
}
.sectionTall{	
	padding:150px 0 130px;
	position: relative;
}
.sectionTall:before{
	content: '';
	width: 1px;
	height: 75px;
	background:#cccccc;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	margin:auto;	
}
.sectionTall.bg-black01:before{
	background:#666;	
}
.sectionTall.num01:before{
	background:#ce7f2a;
    height: 55px;
    z-index: 3;
}
.section.bg-black02{
	padding:0;
}
.section .subSection{
	padding-top: 100px;
}
@media only screen and (max-width:768px) {
	.section{
		padding:60px 0 70px;
	}
	.section .subSection{
		padding-top: 50px;
	}
	.sectionTall{	
		padding:80px 0 60px;
	}
}

/*---------------
num01
----------------*/
.num01{
	position: relative;
	padding:90px 0 120px;
}
/*---------------
bg-color
----------------*/
.bg-white{
	background: url(../imgs/bg-01.gif) repeat;
}
.bg-black01{	
	background: url(../imgs/bg-02.gif) repeat;
}
.bg-black02{	
	background: url(../imgs/bg-03.gif) repeat;
}
.bg-green{	
	background: url(../imgs/bg-04.gif) repeat;
}
/*---------------
image
----------------*/
.image{
	width: 100%;
}
.image img{
	width: 100%;
}
/*---------------
imageBox
----------------*/
.imageBox{
	width: 100%;
}
.imageBox img{
	width: 100%;
}
@media only screen and (max-width:768px) {
	.imageBox{
	    height:200px;
	    overflow: hidden;
	}
	.imageBox img{
		width: auto;
		height: 100%;
		max-width: initial; /* 初期状態にリセット */
		position: absolute;
		top:50%; /* または200px(heightの半分) */
		left: 50%; /* この値を変更すると左右に位置をずらせる */
		transform: translate(-50%, -50%);
	}
}

/*---------------
imageTtl
----------------*/
/*image*/
.imageTtl{
	width: 100%;
	position: relative;
}
/*.imageTtl:before{
	content: '';
	width: 1px;
	height: 80px;
	background:#ce7f2a;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	margin:auto;
	z-index: 3;
}*/
.imageTtl img{
	width: 100%;
}
.imageTtl .imageTtl-inner{
	position: absolute;
	left: 0;
	right: 0;
	top: 50%;
	margin: auto;
	-webkit-transform: translateY(-50%); /* Safari用 */
	transform: translateY(-50%);
	color:#fff;
    padding:0 20px;
    box-sizing: border-box;	
    text-align: center;
}
.imageTtl .imageTtl-inner .en{
	width: 1120px;
	margin:0 auto;
	text-align: right;
}
.imageTtl .headline{
	display: inline-block;
	 text-shadow: 0px 0px 10px rgba(0,0,0,.4), 0px 0px 10px rgba(0,0,0,.4), 0px 0px 10px rgba(0,0,0,.4);
}
@media only screen and (max-width:1120px) {
	.imageTtl .imageTtl-inner .en{
		width: 100%;
	}
}
@media only screen and (max-width:768px) {
	.imageTtl{
	    height:300px;
	    overflow: hidden;
	}
	.imageTtlen{
		height: 150px;
	}
	.imageTtl:before{
		height: 40px;
	}
	.imageTtl img{
		width: auto;
		height: 100%;
		max-width: initial; /* 初期状態にリセット */
		position: absolute;
		top:50%; /* または200px(heightの半分) */
		left: 50%; /* この値を変更すると左右に位置をずらせる */
		transform: translate(-50%, -50%);
	}
}

/*italic*/
.italic{
	font-style: italic;
}
/*text*/
.text{
	font-size: 16px;
	line-height: 2.5;
}
@media only screen and (max-width:768px) {
	.text{
		font-size: 14px;
	}
}

/*---------------
btn
----------------*/
.btn{
	font-family: 'Cormorant Garamond', serif;
}
.btn{
	width: 120px;
	font-size: 12px;
	letter-spacing: 0.15em;
	line-height: 1;
	position: relative;
	margin:0 auto;
	text-align: center;
}
.btn a{
	display: block;
	box-sizing: border-box;
	color:#333333;
}
.btn.white a{
	color:#fff;	
}
.btn.black a{
	color:#fff;	
}
.btn p{
	display: block;
	border:solid 1px #cccccc;	
}
.btn.white p{
	border:solid 1px #fff;	
}
.btn.black p{
	border:solid 1px #000;	
	background:#000;
}
.btn:before{
	content: '';
	width: 3px;
	height: 100%;
	background:#ce7f2a; 
	position: absolute;
	left: 0;
	top: 0;
	transition: .6s;
}
.btn:hover:before{
	width: 100%;
}
.btn span{
	display: block;
	width: 100%;
	height: 100%;
	padding:13px 0 10px;
	box-sizing: border-box;
	position: relative;
	z-index: 2;
}
.btn.btn-print i{
	font-size: 10px;
	margin-right: 5px;
	position: relative;
	z-index: 2;
}
/*printArea*/
.printArea{
	display: none;
	width: 100%;
	text-align: center;
}
.printArea img{
	width: 100%;
}

/*btnBox*/
.btnBox{
	display: flex;
	justify-content: center;
	margin-top: 50px;
}
.btnBox .btn{
	margin:0;
}
.btnBox .btn:nth-child(n+2){
	margin-left: 50px;
}

/*off*/
.btn.off:hover:before a.off{
	width: 0;
}
.btn.off{
	opacity: .3;
	pointer-events: none;
}
@media only screen and (max-width:768px) {
	.btn.btn-print{
		display: none;
	}
	/*btnBox*/
	.btnBox{
		margin-top: 30px;
	}
	.btnBox .btn:nth-child(n+2){
		margin-left: 0;
	}
}
/*---------------
clmBox
----------------*/
.clmBox{
	display: flex;
	justify-content: center;
	align-items: flex-start;
	flex-wrap: wrap;
}
.clmBox.change{
	flex-direction: row-reverse;
}
.clmBox .clm{
	box-sizing: border-box;
}
.clmBox .clm img{
	width: 100%;
}
.clmBox.clm2 .clm{
	width:50%;
}
.clmBox.clm2pa .clm{
	width: 47.7%;
	margin-right: 4.6%;
}
.clmBox.clm2pa .clm:nth-child(even){
	margin-right: 0;
}
/*clm3pa*/
.clmBox.clm3pa{
	justify-content: flex-start;
}
.clmBox.clm3pa .clm{
	width: 31%;
	margin-right: 3%;
}
.clmBox.clm3pa .clm:nth-child(3n){
	margin-right: 0;
}
/*clmImg*/
.clmImg + .headline{
	display: block;
	margin-top: 20px;
}
@media only screen and (max-width:768px) {
	.clmBox.clm2 .clm{
		width: 100%;
	}
	.clmBox.clm2pa .clm{
		width: 100%;
		margin-right: 0;
	}
	.clmBox.clm2pa .clm:nth-child(n+2){
		margin-top: 30px;
	}
	.clmBox.clm3pa .clm{
		width: 100%;
		margin-right: 0;
	}
	.clmBox.clm3pa .clm:nth-child(n+2){
		margin-top: 30px;
	}
}

/*---------------
moveimgBox
----------------*/
.moveimgBox{
	margin-top: 40px;
}
.moveimgBox-img{
	width: 69.04761904761905%;
}
.moveimgBox-txt{
	width: 24.6031746031746%;
	margin-right: 6.349206349206349%;
	padding: 115px 0 0 2.051613%;
	box-sizing: border-box;
	position: relative;
}
.change .moveimgBox-txt{
	margin-right: 0;
	margin-left: 6.349206349206349%;
}
.moveimgBox-txt:before{
	content: '';
    width: 1px;
    height: 150px;
    background: #ce7f2a;
    position: absolute;
    left: 0;
    top: 0;
}
.moveimgBox-txt .headline{
	margin-right: 10%;
}
@media only screen and (max-width:768px) {
	.moveimgBox-img{
		width: 100%;
	}
	.moveimgBox-txt{
		width: 100%;
		margin-right: 0;
		margin-bottom: 30px;
		padding: 55px 0 0 5%;
	}
	.change .moveimgBox-txt{
		margin-left: 0;
	}
	.moveimgBox-txt:before{
	    height: 100px;
	}
	.moveimgBox-txt .headline{
		margin-right: 0;
	}		
}

/*---------------
trainBox
----------------*/
.trainBox{
	margin-top: 40px;
}
.trainBox dl{
	display: flex;
	font-size: 18px;
	line-height: 1;
	margin-bottom: 10px;
	position: relative;
}
.trainBox dl:before{
	content: '';
	width: 100%;
	height: 2px;
	border-bottom:dotted 2px #000;
	position: absolute;
	left: 0;
	bottom: 2px;
}
.trainBox dl strong{
	font-size: 26px;
	font-weight: normal;
}
.trainBox dl p{
	display: inline-block;
	background: #fff;
	position: relative;
	z-index: 2;
}
.trainBox dl dt{
	width: 70%;
	box-sizing: border-box;
    margin-left: -3%;
}
.trainBox dl dt p{
	padding-right: 2px;
}
.trainBox dl dd{
	width: 33%;
	text-align: right;
}
.trainBox dl dd p{
	padding-left: 5px;
}
@media only screen and (max-width:768px) {
	.trainBox dl{
		font-size: 15px;
	}
	.trainBox dl strong{
		font-size: 22px;
	}	
}

/*---------------
numberBox
----------------*/
.numberBox{

}
.numberBox .numberBox-ttl{
	display: flex;
	align-items: center;
	font-size: 18px;
	padding-bottom: 20px;
	margin-bottom: 20px;
	border-bottom:solid 1px #dcdcdc;
}
.numberBox .numberBox-ttl span{
	display: inline-block;
	width: 30px;
	height: 30px;
	vertical-align: middle;
	line-height: 26px;
	color: #fff;
	text-align: center;
	letter-spacing: 0;
	border:solid 2px #ce7f2a;
	box-sizing: border-box;
	background:#000;
	margin-right: 20px;
}
.numberBox .numberBox-ttl p{
	line-height: 2;
}
.numberBox .numberBox-txt{
	padding-left: 40px;
}
@media only screen and (max-width:768px) {
	.numberBox .numberBox-ttl{
		font-size: 16px;
		align-items: flex-start;
	}	
}

/*---------------
planlistBox
----------------*/
.planlistBox{
}
.planlistBox .clm {
	position: relative;
	width: 27%;
	margin-right: 3%;
}
.planlistBox .clm:nth-child(3n){
	margin-right: 0;
}
.planlistBox .clm a{
	display: flex;
	font-size: 26px;
	line-height: 1;
	padding:13px 25px;
	border-top:solid 1px #cccccc;
	border-right:solid 1px #cccccc;
	border-bottom:solid 1px #cccccc;
	box-sizing: border-box;
	color:#333333;
	position: relative;
	z-index: 3;
}
.planlistBox .clm a:hover,
.planlistBox .clm.on a{
	color:#fff;
}
.planlistBox .clm strong{
	font-size: 30px;
	font-weight: normal;
	letter-spacing: 0.05em;
	margin-right: 3px;
}
.planlistBox .clm:before{
	content: '';
	width: 3px;
	height: 100%;
	background:#ce7f2a; 
	position: absolute;
	left: 0;
	top: 0;
	z-index: 3;
}
.planlistBox .clm:after{
	content: '';
	width: 3px;
	height: 100%;
	background:#999999; 
	position: absolute;
	left: 0;
	top: 0;
	z-index: 2;
	transition: .6s;
}
.planlistBox .clm:hover:after,
.planlistBox .clm.on:after{
	width: 100%;
}
.planlistBox-type{
}
.planlistBox-size{	
	margin-left: 15px;
}
@media only screen and (max-width:768px) {
	.planlistBox .clm {
		width: 100% !important;
		margin-right: 0 !important;
	}
	.planlistBox .clm:nth-child(n+2){
		margin-top: 15px !important;
	}	
}

/*---------------
separateimgBox
----------------*/
.separateimgBox{	
	margin-top: 60px;
}
.separateimgBox-img{
	width: 69.04761904761905%;
	display: flex;
	flex-wrap: wrap;
}
.separateimgBox-img .separateimgBox-ph{
	width: 49.42528735632184%;
	margin-right: 1.1494252873563218%;
}
.separateimgBox-img .separateimgBox-ph:nth-child(even){
	margin-right: 0;
}
.separateimgBox-img .separateimgBox-ph:nth-child(n+3){
	margin-top: 10px;
}
/*imgBig*/
.separateimgBox-img.separateimgBox-imgBig .separateimgBox-ph:first-child{
	width: 100%;
	margin-right: 0;
}
.separateimgBox-img.separateimgBox-imgBig .separateimgBox-ph:nth-child(n+2){
	margin-top: 10px;
	margin-right: 1.1494252873563218%;
}
.separateimgBox-img.separateimgBox-imgBig .separateimgBox-ph:last-child{
	margin-right: 0;
}
/*separateimgBox-txt*/
.separateimgBox-txt{
	width: 24.6031746031746%;
	margin-right: 6.349206349206349%;
	padding: 115px 0 0 2.051613%;
	box-sizing: border-box;
	position: relative;
}
.change .separateimgBox-txt{
	margin-right: 0;
	margin-left: 6.349206349206349%;
}
.separateimgBox-txt:before{
	content: '';
    width: 1px;
    height: 150px;
    background: #ce7f2a;
    position: absolute;
    left: 0;
    top: 0;
}
.separateimgBox-txt .headline{
	margin-right: 10%;
}
.separateimgBox-txt .headline-04,
.separateimgBox-txt .cmt{
	position: relative;
	z-index: 2;
}
.separateimgBox-txt .separateimgBox-txt-ttl{
	width: 1em;
	font-size: 84px;
	color:#dddedc;
    letter-spacing: 0;
    line-height: 1;
    position: absolute;
    top: -60px;
    right: 0;
}
.separateimgBox-txt .separateimgBox-txt-ttl span{
	display: block;
	height: 1em;
}
.separateimgBox-txt .separateimgBox-txt-ttl span.kara{
	height: 0.1em;
}
.separateimgBox-txt .separateimgBox-txt-ttl span.tate{
	-webkit-transform:rotate(87deg) scaleY(-1);
    -moz-transform:rotate(87deg) scaleY(-1);
    -ms-transform:rotate(87deg) scaleY(-1);
    -o-transform:rotate(87deg) scaleY(-1);
    transform:rotate(87deg) scaleY(-1);
    margin-top: 5px !important;
}
.separateimgBox-txt .separateimgBox-txt-ttl span.komoji{
    line-height: 0.8em;
}
.separateimgBox-txt .separateimgBox-txt-ttl span:nth-child(n+2){
	margin-top: 20px;
}
.separateimgBox-txt .separateimgBox-txt-ttl.katakana span:nth-child(n+2){
	margin-top: 0;
}
.bg-black01 .separateimgBox-txt .separateimgBox-txt-ttl,
.bg-black02 .separateimgBox-txt .separateimgBox-txt-ttl{
	color: #585857;
}
@media only screen and (max-width:768px) {
	.separateimgBox-img{
		width: 100%;
	}
	.separateimgBox-img .separateimgBox-ph{
		width: 100%;
		margin-right: 0;
	}
	.separateimgBox-img .separateimgBox-ph:nth-child(n+2){
		margin-top: 10px;
	}
	.separateimgBox-img.separateimgBox-imgBig .separateimgBox-ph:nth-child(n+2){
		margin-right: 0;
	}
	.separateimgBox-img.separateimgBox-imgBig .separateimgBox-ph:last-child{
		margin-right: 0;
	}
	.separateimgBox-txt{
		width: 100%;
		margin-right: 0;
		margin-bottom: 30px;
		padding: 55px 3.129032258064516% 0 5%;
	}
	.change .separateimgBox-txt{
		margin-left: 0;
	}
	.separateimgBox-txt:before{
	    height: 100px;
	}
	.separateimgBox-txt .headline{
		margin-right: 0;
	}
	.separateimgBox-txt .separateimgBox-txt-ttl{
		font-size: 60px;
	    top: -40px; 
	}
	
}


/*---------------
moveimgBox02
----------------*/
.moveimgBox02{	
}
.moveimgBox02 .moveimgBox02-img{
	width: 52.67857142857143%;
	position: relative;
}
.moveimgBox02 .moveimgBox02-txt{
	width: 47.32142857142857%;
	padding: 160px 15.178571428571427% 0 0;
	box-sizing: border-box;
	position: relative;
}
.moveimgBox02 .moveimgBox02-txt:before{
	content: '';
	width: 1px;
	height: 95px;
	background:#ce7f2a;
	position: absolute;
	left: 0;
	top: 0;
}
.change.moveimgBox02 .moveimgBox02-txt{
	padding: 160px 0 0 15.178571428571427%;
}
.change.moveimgBox02 .moveimgBox02-txt:before{
	left: 30%;
}
@media only screen and (max-width:768px) {
	.moveimgBox02 .moveimgBox02-img{
		width: 100%;
	}
	.moveimgBox02 .moveimgBox02-txt{
		width: 100%;
		padding: 80px 0 60px;
		text-align: center;
		box-sizing: border-box;
	}
	.moveimgBox02 .moveimgBox02-txt:before{
		content: none;
	}
	.change.moveimgBox02 .moveimgBox02-txt{
		padding: 50px 0 60px;
	}
}


/*---------------
selectBox
----------------*/
.selectBox .clm:first-child{
	position: relative;
	padding-right: 150px;
}
.selectBox .clm:first-child:after{
	content: 'or';
	font-size: 40px;
	color:#cccccc;
	position: absolute;
	right: 55px;
	top: 50%;
	-webkit-transform: translateY(-50%); /* Safari用 */
	transform: translateY(-50%);
}
.selectBox-ph{
	width: 300px;
	height: 300px;
}
.selectBox-ph span img{
	max-width: 300px;
}
.selectBox-ph .selectBox-ttl{
	font-size: 42px;
	letter-spacing: 0.3em;
/*	text-shadow: rgb(255, 255, 255) -10px -20px 14px,
				 rgb(255, 255, 255) -10px 8px 14px,
				 rgb(255, 255, 255) 8px -16px 14px,
				 rgb(255, 255, 255) 8px 16px 14px,
				 rgb(255, 255, 255) -10px -20px 14px,
				 rgb(255, 255, 255) -10px 8px 14px,
				 rgb(255, 255, 255) 8px -16px 14px,
				 rgb(255, 255, 255) 8px 16px 14px;	*/
	position: absolute;
	left: 0;
	right: 0;
	top: 50%;
	-webkit-transform: translateY(-50%); /* Safari用 */
	transform: translateY(-50%);
	margin:auto;
	text-align: center;
}
.selectBox-ph .caption{
	left: 0;
	right: 0;
	margin:auto;
	text-align: center;
}
@media only screen and (max-width:768px) {
	.selectBox .clm:first-child{
		padding-right: 0;
		padding-bottom: 50px;
	}
	.selectBox .clm:first-child:after{
		font-size: 30px;
		left: 0;
		right: 0;
		top: auto;
		bottom:0;
		text-align: center;
	}
	.selectBox-ph{
		width: 240px;
		height: 240px;
	}
	.selectBox-ph span img{
		max-width: 240px;
	}
	.selectBox-ph .selectBox-ttl{
		font-size: 34px;
	}

}

/*---------------
cntlinkBox
----------------*/
.cntlinkBox{
	padding-top: 70px;
	border-top: solid 1px #d7d8d6;
}
.bg-black01 .cntlinkBox,
.bg-black02 .cntlinkBox{
	border-top: solid 1px #5d5d5d;	
}
.cntlinkBox .cntlinkBox-inner{
	width: 82%;
	position: relative;
	text-align: center;
	margin: 0 auto;
}
.cntlinkBox .cntlinkBox-inner a{
	display: block;
}
/*cntlinkBox-img*/
.cntlinkBox .cntlinkBox-inner .cntlinkBox-img{
	width: 97.5609756097561%;
	height: 110px;
	text-align: left;
	border-top:solid 1px #757575;
	border-right:solid 1px #757575;
	border-bottom:solid 1px #757575;
	border-left:solid 3px #ce7f2a;
	position: relative;
}
.cntlinkBox .cntlinkBox-inner .cntlinkBox-img:before{
	content: '';
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,.4);
	position: absolute;
	left: 0;
	top: 0;
	transition: 1s;
}
.cntlinkBox .cntlinkBox-inner a:hover .cntlinkBox-img:before{
	background: rgba(0,0,0,0);	
}
.cntlinkBox .cntlinkBox-inner .cntlinkBox-txt{
	color:#fff;
	font-size: 17px;
	text-shadow: 0px 0px 13px rgba(0,0,0,.8), 0px 0px 13px rgba(0,0,0,.8), 0px 0px 13px rgba(0,0,0,.8);
	position: absolute;
	left: 6%;
	top: 50%;
	-webkit-transform: translateY(-50%); /* Safari用 */
	transform: translateY(-50%);
	margin:auto;
	text-align:left;
}
/*cntlinkBox-btn*/
.cntlinkBox .cntlinkBox-inner .cntlinkBox-btn{
	font-size: 14px;
	color:#fff;
	line-height: 1;
	background: rgba(4,4,4,.7);
	width: 26.82926829268293%;
	height: 70px;
	position: absolute;
	right: 0;
	top: 50%;
	-webkit-transform: translateY(-50%); /* Safari用 */
	transform: translateY(-50%);
}
.cntlinkBox .cntlinkBox-inner .cntlinkBox-btn.white{
	background: rgba(255,255,255,.8);
	color:#000;	
}
.cntlinkBox .cntlinkBox-inner .cntlinkBox-btn p{
	position: absolute;
	left: 0;
	right: 0;
	top: 50%;
	-webkit-transform: translateY(-50%); /* Safari用 */
	transform: translateY(-50%);
}
.cntlinkBox .cntlinkBox-inner .cntlinkBox-btn p i{
	display: inline-block;
	font-size: 14px;
	line-height: 32px;
	margin-left: 25px;
	padding-left: 25px;
	position: relative;
}
.cntlinkBox .cntlinkBox-inner .cntlinkBox-btn p i:after{
	content: '';
	width: 1px;
	height: 100%;
	background: rgba(255,255,255,.4);
	position: absolute;
	left: 0;
	top: 0;
}
.cntlinkBox .cntlinkBox-inner .cntlinkBox-btn.white p i:after{
	background: rgba(0,0,0,.4);	
}
@media only screen and (max-width:768px) {
	.cntlinkBox{
		padding-top: 40px;
	}
	/*cntlinkBox-img*/
	.cntlinkBox .cntlinkBox-inner .cntlinkBox-img{
		width: 100%;
		height: 150px;
	    position: relative;
	    overflow: hidden;
	}
	.cntlinkBox .cntlinkBox-inner .cntlinkBox-img img{
		width: auto;
		height: 100%;
		max-width: initial; /* 初期状態にリセット */
		position: absolute;
		top:50%; /* または200px(heightの半分) */
		left: 50%; /* この値を変更すると左右に位置をずらせる */
		transform: translate(-50%, -50%);
	}
	.cntlinkBox .cntlinkBox-inner .cntlinkBox-txt{
		width: 84%;
		font-size: 15px;
		left: 0;
		right: 0;
		top: 40%;
		-webkit-transform: translateY(-40%); /* Safari用 */
		transform: translateY(-40%);
		font-weight: bold;
	}
	/*cntlinkBox-btn*/
	.cntlinkBox .cntlinkBox-inner .cntlinkBox-btn{
		font-size: 13px;
		width: 70%;
		height: 50px;
		left: 0;
		right: 0;
		top: auto;
		bottom: -30px;
		margin:auto;
		-webkit-transform: none; /* Safari用 */
		transform: none;
	}
	.cntlinkBox .cntlinkBox-inner .cntlinkBox-btn p i{
		font-size: 12px;
		line-height: 26px;
		margin-left: 15px;
		padding-left: 15px;
	}

}

/*---------------
circleBox
----------------*/
.circleBox.clmBox{
}
.circleBox.clmBox .clm{
	text-align: center;
}
.circleBox.clmBox .clm:nth-child(n+2){
	margin-left: 5%;
}
.circleBox.clmBox .clm .circleBox-ph{
	width:226px;
	height: 226px;
}
.circleBox.clmBox .clm .circleBox-ph span img{
	width: 226px;
}
.circleBox .cnt-ttl{
	color: #fff;
}
@media only screen and (max-width:768px) {
	.circleBox{
		padding:0;
	}
	.circleBox:before{
		height: 45px;
	}
	.circleBox.clmBox .clm:nth-child(2),
	.circleBox.clmBox .clm:nth-child(3){
		margin-left: 0;
	}
	.circleBox.clmBox .clm:nth-child(n+2){
		margin-top: 70px;
	}
	.circleBox .circleBox-ph{
		margin:0 auto 20px;
	}
}

/*---------------
zoomImg
----------------*/
.zoomImg{
	width: auto;
	height: auto;
	margin:0 auto 40px;
	border-radius: 50%;
	overflow: hidden;
	z-index: 2;/*マスクに必要*/
}
.zoomImg span{
	display: block;
	min-width: 100%;
	min-height: 100%;
	border-radius: 50%;
}
/*▼▼▼ .zoomImg span.zoomout img ▼▼▼*/
[data-aos="imgZoom"]{
	transform: scale(1.1);	
}
[data-aos="imgZoom"].aos-animate{
	-webkit-animation: zoomImgAnim 2.0s ease 0s 1 forwards;/*表示時間+start時間*/
	animation: zoomImgAnim 2.0s ease 0s 1 forwards;/*表示時間+start時間*/
}
@-webkit-keyframes zoomImgAnim {
	100% {
	    transform: scale(1.0);
	}
}
@keyframes zoomImgAnim {
	100% {
	    transform: scale(1.0);
	}
}
.zoomImg .caption{
	left: 0;
	right: 0;
	bottom: 15px;
	margin:auto;
	text-align: center;
}
/*---------------
slideImg
----------------*/
.slideImg{
	position: relative;
	overflow:hidden;
}
.slideImg img{
	width:100%;
	opacity: 0;
	transform: scale(1.05);
    transition: 1s;
}
/*▼▼▼ .slideImg .slideImg-msk ▼▼▼*/
[data-aos="mskin"]{
    width: 0;
    height: 100%;
    display: block;
    background: #363636;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
}
[data-aos="mskin"].aos-animate{
	width: 100%;

	-webkit-animation: slideImgAnim 1.0s ease 0.2s 1 forwards;/*表示時間+start時間*/
	animation: slideImgAnim 1.0s ease 0.2s 1 forwards;/*表示時間+start時間*/
}
@-webkit-keyframes slideImgAnim {
	100% {
		opacity: 0;
	}
}
@keyframes slideImgAnim {
	100% {
		opacity: 0;
	}
}

/*▼▼▼ .slideImg img ▼▼▼*/
[data-aos="imgIn"].aos-animate{
	-webkit-animation: slideImgAnimimg 1.0s ease 0.3s 1 forwards;/*表示時間+start時間*/
	animation: slideImgAnimimg 1.0s ease 0.3s 1 forwards;/*表示時間+start時間*/
}
@-webkit-keyframes slideImgAnimimg {
	100% {
		opacity: 1;
		transform: scale(1);
	}
}
@keyframes slideImgAnimimg {
	100% {
		opacity: 1;
		transform: scale(1);
	}
}

/*--------------
nextBack
--------------*/
.nextBack{
}
.nextBack.off .nextBack-inner{
	opacity: .5;
	pointer-events: none;
}
.nextBack .wrap{
	position: relative;
	padding:75px 0;
}
.nextBack .wrap:before{
	content: '';
	width: 1px;
	height: 50px;
	background:#ce7f2a;
	position: absolute;
	left: 0;
	bottom: 0;
}
.nextBack .nextBack-inner{
	width: 96%;
	position: relative;
	text-align: center;
	margin: 0 0 0 auto;
}
.nextBack .nextBack-inner a{
	display: block;
}
.nextBack .nextBack-inner .nextBack-img{
	width: 97.91666666666666%;
	height: 160px;
	text-align: left;
	border:solid 2px #757575;
	position: relative;
}
.nextBack .nextBack-inner .nextBack-img:before{
	content: '';
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,.2);
	position: absolute;
	left: 0;
	top: 0;
	transition: 1s;
}
.nextBack .nextBack-inner a:hover .nextBack-img:before{
	background: rgba(0,0,0,0);	
}
.nextBack .nextBack-inner .nextBack-txt{
	color:#fff;
	font-size: 20px;
	text-shadow: 0px 0px 10px rgba(0,0,0,.4), 0px 0px 10px rgba(0,0,0,.4), 0px 0px 10px rgba(0,0,0,.4);
	position: absolute;
	left: 0;
	right: 0;
	top: 50%;
	-webkit-transform: translateY(-50%); /* Safari用 */
	transform: translateY(-50%);
	margin:auto;
}
.nextBack .nextBack-inner .nextBack-txt small{
	display: block;
	font-size: 14px;
	margin-top:15px;
}
.nextBack .nextBack-btn{
	color:#fff;
	line-height: 70px;
	background: rgba(77,76,76,.8);
	width: 70px;
	height: 70px;
	position: absolute;
	right: 0;
	top: 50%;
	-webkit-transform: translateY(-50%); /* Safari用 */
	transform: translateY(-50%);
}
@media only screen and (max-width:768px) {
	.nextBack .wrap:before{
		content: none;
	}
	.nextBack .nextBack-inner{
		width: 80%;
		margin:0 auto;
	}
	.nextBack .nextBack-inner .nextBack-img{
		width: 94%;
	    height:150px;
	    position: relative;
	    overflow: hidden;
	}
	.nextBack .nextBack-inner .nextBack-img img{
		width: auto;
		max-width: initial; /* 初期状態にリセット */
		position: absolute;
		top:50%; /* または200px(heightの半分) */
		left: 50%; /* この値を変更すると左右に位置をずらせる */
		transform: translate(-50%, -50%);
	}
	.nextBack .nextBack-inner .nextBack-txt{
		width: 80%;
		font-size: 16px;
		margin: 0 0 0 15px;
	}
	.nextBack .nextBack-inner .nextBack-txt small{
		font-size: 12px;
	}
	.nextBack .nextBack-inner .nextBack-btn{
		font-size: 13px;
		width: 50px;
		height: 50px;
		right: 0;
		line-height: 50px;
	}
}

/*--------------
spslideBox
--------------*/
@media only screen and (max-width:736px) {
	.spslideBox{
		display: block !important;
		position: relative;
		padding-top: 35px;
	}
	.scrollSlide .imageHolder{
		margin: 0;
		position: relative;
		overflow: hidden;
		border:solid 1px #ccc;
		padding:20px;
	}
	.scrollSlide .images{
		max-width: 100%;
		height: 350px;
		margin: auto;
		overflow-x: scroll;
	}
	.scrollSlide .images img{
		max-width: none;
		height: 100%;
	}
	.touch{
		position: absolute;
		left: 0;
		top: 0;
	}
	.touch img{
		width: 10%;		
	}
	.touch:after{
		content: '左右にスワイプしてご覧ください。';
		padding-left: 10px;
		font-size: 10px;
		line-height: 25px;
		font-style:normal;
	}
}


/*--------------
blur
--------------*/
/*▼▼▼ .blur ▼▼▼*/
[data-aos="blur"]{
	-webkit-filter: blur(5px);
	filter: blur(5px);
	transform: scale(1.1);
}
[data-aos="blur"].aos-animate {
  -webkit-animation: blurAnim 2.0s ease 0.5s 1 forwards;/*表示時間+start時間*/
	animation: blurAnim 2.0s ease 0.5s 1 forwards;/*表示時間+start時間*/
}
@-webkit-keyframes blurAnim {
	100% {
		-webkit-filter: blur(0px);
		filter: blur(0px);
		transform: scale(1.0);
	}
}
@keyframes blurAnim {
	100% {
		-webkit-filter: blur(0px);
		filter: blur(0px);
		transform: scale(1.0);
	}
}


/*--------------
plot
--------------*/

[data-aos="plot"]{
	opacity: 0;
}
[data-aos="plot"].aos-animate {
  -webkit-animation: plotAnim 2.0s ease 0.5s 1 forwards;/*表示時間+start時間*/
	animation: plotAnim 2.0s ease 0.5s 1 forwards;/*表示時間+start時間*/
}
@-webkit-keyframes plotAnim {
	100% {
		opacity: 1;
	}
}
@keyframes plotAnim {
	100% {
		opacity: 1;
	}
}