@charset "utf-8";

/* style */
.page-mv {background-image:url(../../arrange/img/mv.jpg);}

.arrange-catch {padding:220px 0 50px 0;}
.arrange-catch .catch {text-align:center;}
.arrange-catch dl {text-align:center; margin:100px 0 0 0;}
.arrange-catch dt {font-size:3.0rem; line-height:2;}
.arrange-catch dd {max-width:640px; font-size:1.4rem; line-height:2.1; margin:40px auto 0 auto;}

.arrange-ctx {padding:0 0 100px 0;}
.arrange-ctx .box {padding:50px 50px 60px 50px; background-color:#fff;}
.arrange-ctx .clm1 {margin:20px -20px 0 -20px; display:flex;}
.arrange-ctx .clm1 > div {width:33.33%; padding:0 20px; box-sizing:border-box;}
.arrange-ctx .clm2 {margin:30px 0 0 0; display:flex;}
.arrange-ctx .clm2 .img1 {width:44%;}
.arrange-ctx .clm2 .ctx {width:56%; padding:0 0 0 15px; box-sizing:border-box;}
.arrange-ctx .txt1 {text-align:left; display:flex; align-items:center;}
.arrange-ctx .txt1 dt {width:70px;}
.arrange-ctx .txt1 dd {font-size:2.8rem; line-height:1.5; letter-spacing:-1px; padding:0 0 0 15px; flex:1;}
.arrange-ctx .txt1.type1 dd {color:#009eea;}
.arrange-ctx .txt1.type2 dd {color:#2ab300;}
.arrange-ctx .txt1.type3 dd {color:#fd7900;}
.arrange-ctx .txt1.type4 dd {color:#f84295;}
.arrange-ctx .txt1.type1 + .txt2 {margin:-1.2em 0 0 85px;}
.arrange-ctx .txt1.type2 {margin-top:32px;}
.arrange-ctx .txt1.type3 {margin-top:42px;}
.arrange-ctx .txt1.type4 {margin-top:40px;}
.arrange-ctx .txt2 {text-align:left; margin:10px 0 0 0;}
.arrange-ctx .txt2 p {font-size:1.9rem; line-height:1.5;}
.arrange-ctx .txt2 li {font-size:1.2rem; line-height:1.6; letter-spacing:0; padding:0 0 0 1.2em; position:relative;}
.arrange-ctx .txt2 li::before {content:'※'; display:block; position:absolute; top:0; left:0;}
.arrange-ctx .txt3 {margin:10px 0 0 0;}
.arrange-ctx .txt3 dt {font-size:2.4rem; font-weight:bold; letter-spacing:-1px; text-align:center;}
.arrange-ctx .txt3 dt span {color:#009eea;}
.arrange-ctx .txt3 dd {font-size:1.4rem; line-height:2; text-align:left; margin:10px 0 0 0;}
.arrange-ctx .img1 {}
.arrange-ctx .img2 {margin:10px 0 0 0;}

.arrange-map {padding:0 0 100px 0;}
.arrange-map .txt1 {font-size:5.0rem; text-align:center; letter-spacing:0;}
.arrange-map .txt1 span {color:#0085d0;}
.arrange-map .txt2 {font-size:3.5rem; text-align:center; letter-spacing:0; margin:40px 0 0 0;}
.arrange-map .txt2 span a{color:#0085d0;}
.arrange-map .box > div {margin:40px 0 0 0; padding:70px 30px 50px 30px; background-color:#fff; position:relative;}
.arrange-map .box > div::before {content:''; width:100%; height:100%; border:solid 3px #0094e1; box-sizing:border-box; display:block; position:absolute; top:0; left:0;}
.arrange-map .box > div:nth-of-type(1)::before {display:none;}
.arrange-map .box > div:nth-of-type(1)::after {content:''; width:114px; height:114px; margin:0 0 -57px -57px; background-color:#fff; display:block; position:absolute; bottom:0; left:50%; transform:rotate(45deg);}
.arrange-map .box > div:nth-of-type(2) {margin-top:100px;}
.arrange-map .box .clm {max-width:970px; text-align:left; margin:0 auto; display:flex; justify-content:space-between; position:relative; z-index:5;}
.arrange-map .box .ctx {width:36.2%; padding:0 0 340px 0; position:relative; z-index:5;}
.arrange-map .box .ctx dt {font-size:2.9rem; font-weight:500; line-height:1.6; letter-spacing:0; color:#0085d0;}
.arrange-map .box .ctx dt span {font-size:2.5rem; line-height:1.3; text-align:center; color:#fff; margin:0 0 20px 0; padding:10px; background-color:#0094e1; border-radius:3px; display:block;}
.arrange-map .box .ctx dd {font-size:1.6rem; font-weight:500; line-height:1.87; text-align:left; margin:15px 0 0 0;}
.arrange-map .box .map {width:51.7%; position:relative; z-index:5;}
.arrange-map .box .img {width:47.6%; position:absolute; bottom:0; left:-20px;}
@media screen and (max-width:1270px){
	.arrange-ctx .box {padding-left:3.9vw; padding-right:3.9vw;}
	.arrange-ctx .clm2 .ctx {padding:0 0 0 1.2vw;}
	.arrange-ctx .clm2 .txt1 dt {width:5.5vw;}
	.arrange-ctx .clm2 .txt1 dd {font-size:2.2vw;}
	.arrange-ctx .txt1.type2 {margin-top:2.5vw;}
	.arrange-ctx .txt1.type3 {margin-top:3.3vw;}
	.arrange-ctx .txt1.type4 {margin-top:3.1vw;}
	.arrange-ctx .clm2 .txt2 {margin:0.7vw 0 0 0;}
	.arrange-ctx .clm2 .txt2 p {font-size:1.5vw;}
	.arrange-ctx .clm2 .txt2 li {font-size:0.9vw;}
}
@media screen and (max-width:767px){
	.page-mv {height:375px; background-image:url(../../arrange/img/mv_sp.jpg);}

	.arrange-catch {padding:80px 0 60px 0;}
	.arrange-catch dl {margin:50px 0 0 0;}
    .arrange-catch dt {font-size:1.5rem;}
    .arrange-catch dd {font-size:1.0rem; text-align:left; margin:20px 0 0 0;}

	.arrange-ctx {padding:0 0 60px 0;}
	.arrange-ctx .box {padding:50px 25px;}
	.arrange-ctx .clm1 {margin:0; display:block;}
	.arrange-ctx .clm1 > div {width:auto; margin:20px 0 0 0; padding:0;}
	.arrange-ctx .clm2 {margin:0; display:block;}
	.arrange-ctx .clm2 .img1 {width:auto;}
	.arrange-ctx .clm2 .ctx {width:auto; padding:0;}
	.arrange-ctx .clm2 .txt1 dt {width:44px;}
	.arrange-ctx .clm2 .txt1 dd {font-size:1.7rem;}
	.arrange-ctx .clm2 .txt2 {margin:15px 0 0 0;}
	.arrange-ctx .clm2 .txt2 p {font-size:1.2rem;}
	.arrange-ctx .clm2 .txt2 li {font-size:1.0rem;}
	.arrange-ctx .txt1 dt {width:44px;}
	.arrange-ctx .txt1 dd {font-size:1.7rem; padding:0 0 0 10px;}
	.arrange-ctx .txt1.type1 {margin-top:40px;}
	.arrange-ctx .txt1.type1 + .txt2 {margin:15px 0 0 0;}
	.arrange-ctx .txt1.type2 {margin-top:30px;}
	.arrange-ctx .txt1.type3 {margin-top:30px;}
	.arrange-ctx .txt1.type4 {margin-top:30px;}
	.arrange-ctx .txt2 {margin:5px 0 0 0;}
	.arrange-ctx .txt2 p {font-size:1.2rem;}
	.arrange-ctx .txt2 li {font-size:1.0rem;}
	.arrange-ctx .txt3 {margin:10px 0 0 0;}
	.arrange-ctx .txt3 dt {font-size:1.7rem;}
	.arrange-ctx .txt3 dd {font-size:1.0rem; margin:5px 0 0 0;}
	.arrange-ctx .img1 {}
	.arrange-ctx .img2 {margin:10px 0 0 0;}

	.arrange-map {padding:0 0 60px 0;}
    .arrange-map .txt1 {font-size:2.5rem;}
    .arrange-map .txt2 {font-size:1.8rem;}
	.arrange-map .box > div {margin:20px 0 0 0; padding:30px 20px;}
	.arrange-map .box > div::before {border:solid 2px #0094e1;}
	.arrange-map .box > div:nth-of-type(1)::after {width:50px; height:50px; margin:0 0 -25px -25px;}
	.arrange-map .box > div:nth-of-type(2) {margin-top:60px;}
	.arrange-map .box .clm {display:block;}
	.arrange-map .box .ctx {width:auto; padding:0;}
	.arrange-map .box .ctx dt {font-size:2.4rem;}
	.arrange-map .box .ctx dt span {font-size:2.2rem; margin:0 0 10px 0; padding:5px;}
	.arrange-map .box .ctx dd {font-size:1.6rem; margin:10px 0 0 0;}
	.arrange-map .box .map {width:auto; margin:20px 0 0 0;}
	.arrange-map .box .img {width:auto; margin:20px 0 0 0; position:static;}
}
