@charset "UTF-8";

html{
	font-size: 62.5%; 
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	overflow: auto;
	}

body{
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
	color: #231815;
	letter-spacing: 0.03em;
	line-height: 1.5;
	padding-top: 0!important;
	font-feature-settings: "palt";
}

:root{
--pink:#d00080;
--text: #231815;
--gray:#acadae;
--green: #3da7b7;
--white:#fff;
--bei:#f6f0f0;
--purple:#555598;
--blue: #4061a1;
--mincho: "Zen Old Mincho", serif;
--tsukua:"fot-tsukuardgothic-std", sans-serif;
--red: #e64241;
--yellow: #fff100;
--font-size--small: clamp(1.1rem, 1.4vw, 1.4rem);
--font-size--small-title: clamp(1.2rem, 1.8vw, 1.8rem);
--font-size--text: clamp(1.55rem, 2.4vw, 2.4rem);
--font-size--medium: clamp(1.8rem, 2.4vw, 2.4rem);
--font-size--large: clamp(1.743rem, 3.2vw, 3.2rem);
}





a:hover{
	opacity: 0.7;
}

img{
	width: 100%;
	height: auto;
}

.sp{
	display: none;
}

.sp_02{
	display: none;
}

.pc{
	display: block;
}

.mat_2{
	margin-top: 2%;
}

.mat_5{
	margin-top: 5%;
}

.pab_10{
	padding-bottom: 10%;
}

.te_ce{
	text-align: center;
}

.pa2{
	padding: 0 2%;
}

/* ---------------
	head
----------------*/

header{
	height: 92px;
	margin: 0 auto;

}

.head{
	display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
	height: 92px;
    margin: 0 auto;
		position: fixed;
		z-index: 999;
		background-color: #fff;
}

.head_l{
	width: 77%;
	display: flex;
	align-items: center;
	justify-content: flex-start;
}

.head .logo{

    padding-left: 2%;
}

.head .logo img{
	max-width: 220px;
}


.head .tel{

    padding-left: 7%;
    padding-right: 1%;
}

.head .tel img{
	max-width: 330px;
}

.head .btn{
	width: 23%;
    height: 92px;
    background-color: #555598;
    position: relative;
	max-width: 180px;
}

.head .btn img{
	position: absolute;
    padding: 3%;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 100%;

}

/* ---------------
	main
----------------*/

section{
	padding-bottom: 15%;
}

.top{
	background: linear-gradient(rgba(243,242,241,0),rgba(243,242,241,1));
}

.max{
	max-width: 950px;
	margin: 0 auto;
}

.wrap{
	margin: 0 5%;
}

.wrap_ce{
	width: 80%;
    margin: 0 auto;
}

.area_top{
	padding-top: 12%;
	margin-bottom: 10%;
}

.top_up{
	background-image: url(../img/top_back.png);
	background-repeat: no-repeat;
	background-size: cover;
	height: 90vh;
	padding-top: 5%;
	background-position:center;
	-webkit-mask-image: linear-gradient(to bottom, black 70%, transparent 100%);
 	 mask-image: linear-gradient(to bottom, black 70%, transparent 100%);  
}

.top_up div{
	max-width: 1000px;
	width: 80%;
	margin: 0 auto;
	padding-top: 5%;
}

.top_un_f{
	box-shadow: 4px 4px 11px 0px rgba(35, 24, 21, 0.4);
}

.top_un_s{
	background-color: #fff;
	border: 1px solid var(--gray);
	margin-top: 5%;
	padding: 5% 3%;
	font-size: clamp(1.6rem, 2.4vw, 2.4rem);
	line-height: 1.7;
}

.tel_area_t{
	background-color: #fff;
	margin-top: 5%;
	padding: 8% 5%;
	font-size: var(--font-size--medium);

}

.tel_area_t_t p{
	font-weight: 700;
	font-size: clamp(2rem, 2.7vw, 2.7rem);
}

.tel_area_t_b, .tel_area_t_u{
	margin-top: 3%;
}

.tel_area_t_u{
	padding: 3% 0;
	border-top: 1px solid var(--text);
	border-bottom: 1px solid var(--text);
}

.tel_area_t_u p:first-of-type{
	font-weight: 700;
	font-size: clamp(1.8rem, 2.2vw, 2.2rem);
}

.pink{
	color: var(--pink);
}

.blue{
	color: var(--blue);
}


.tel_area_t_u p:last-of-type{
	font-size: clamp(1.6rem, 2vw, 2rem);
	line-height: 1.7;
	margin-top: 1%;
}

@media (max-width: 768px){

	.head .logo{
		width: 40%;
	}




	.head .tel{
		width: 57%;
	}

	.tel_area_t_u{
		padding: 5% 0;
		margin-top: 5%;
	}
	.tel_area_t_u p:last-of-type{
		margin-top: 1%;
	}

	.area_top{
		padding-top: 20%;
		margin-bottom: 14%;
	}

	.head{
		height: 70px;
	}

	header{
		height: 70px;
	}

	.head .btn{
		height: 70px;
	}

	.head .tel{
		padding-left: 4%;
	}

	

}

/* ---------------
	part1
----------------*/
.part01{
	background-color: var(--green);
}

.part04{
	background-color: var(--purple);
}

.part05{
	background-color: #e4e5ee;
}

.part06{
	background-color: #f3f2f1;
}

h1{
	font-family: var(--mincho);
	font-size: clamp(2.8rem, 3.4vw, 3.4rem);
	text-align: center;
	position: relative;
	
}


h1:before {
	display: inline-block;
	position: absolute;
	content: '';
  	bottom: -4px; /*下線の上下の位置*/
  	left: 50%;
  	width: 180px; /*下線の幅*/
  	height: 1px; /*下線の太さ*/
  	-moz-transform: translateX(-50%);
  	-webkit-transform: translateX(-50%);
  	-ms-transform: translateX(-50%);
  	transform: translate(-50%); /*位置の調整*/

}

.pa_whi h1{
	color: var(--white);
}

.pa_whi h1::before{
  	background-color: var(--white); /*下線の色*/
}

.pa_bla h1{
	color: #3e3a39;
}

.pa_bla h1::before{
  	background-color: #3e3a39; /*下線の色*/
}

.pa_whi_area{
	background-color: #fff;
	margin-top: 9%;
	padding: 8% 5%;
}

.pa_bei_area{
	background-color: var(--bei);
	position: relative;
	margin-top: 9%;
}


h2{
	font-size: clamp(2.2rem, 3.4vw, 3.4rem);
	position: relative;
	font-weight: 700;
	line-height: 1.2;
	padding-left: 1.5%;
}

.pa_whi_area h3 {
	text-decoration: underline;
	font-size: clamp(1.8rem, 2.2vw, 2.2rem);
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
	margin: 40px 0 20px;
}

.unit01 h2{
	border-left: solid 7px #718cc7;/*左線*/
}

.unit02 h2{
	border-left: solid 7px #91a074;/*左線*/
}

.unit03 h2{
	border-left: solid 7px #9c4998;/*左線*/
}

.unit04 h2{
	border-left: solid 7px #9a569e;/*左線*/
}

.unit05 h2{
	border-left: solid 7px #087bb3;/*左線*/
}



.detail p{
	border-top: solid 1px #3e3a39;
	margin-top: 1.5%;
	padding-top: 1.5%;
	font-size: clamp(1.6rem, 2vw, 2rem);
}

.detail img{
	margin-top: 2%;
}

.detail_map{
	margin-top: 5%;
}

.part01_btn{
	width: 76%;
	margin: 0 auto;
	padding-top: 3%;
}

.part02_num{
	position: absolute;
	width: 40px;
}



.num_01{
	top: -8%;
	left: 5%;
}

.num_02{
	top: -8%;
	right: 6%;
}

.part02_detail{
	display: flex;
}

.reverse{
	flex-direction:row-reverse
}


.part02_txt{
	padding: 8% 3% 5% 5%;
}

.reverse .part02_txt{
	padding: 8% 5% 5% 3%;
}


.part02_txt div{
	font-family: var(--tsukua);
}

.part02_title p{
	font-weight: 700;
	font-size: clamp(2rem, 2.6vw, 2.6rem);
	border-bottom: solid 1px var(--text);
	padding-bottom: 2%;
	line-height: 1.4;
}

.part02_t p{
	padding-top: 2%;
	font-weight: 400;
	font-size: clamp(1.5rem, 2vw, 2rem);
	padding-top: 2%;
	line-height: 1.6;

}

.part02_img{
	padding: 4% 0;	
}

.part02_img img{
	height: 240px;
    width: auto;
    margin-left: 15%;
}

.reverse .part02_img img{
	height: 240px;
    width: auto;
    margin-left: -15%;
}

.back_ocher{
	background-color: #ae9067;
}

.back_ocher p{
	color: var(--white);
	font-size: clamp(2.2rem, 3.8vw, 3.8rem);
	font-weight: 700;
	padding: 20px 0;
}


.part03_de{
	display: flex;
	padding-top: 5%;
	width: 90%;
	margin: 0 auto;
	gap: 2%;
}

.part03_de div:first-of-type{
	width: 60%;
}

.part03_de div:last-of-type{
	width: 38%;
}

.part03_txt p{
	line-height: 1.8;
	font-size: clamp(1.6rem, 2.0vw, 3.8rem);	
}

.part04_detail img{
	margin-top: 2%;
}


.part04_detail{
	text-align: center;
	font-size: clamp(1.5rem, 1.9vw, 1.9rem);
	font-weight: 700;
	padding-top: 5%;
	padding-bottom: 1%;
}

.part04_detail_txt{
	text-align: center;
	font-size: clamp(1.5rem, 1.8vw, 1.8rem);
	padding-top: 2%;
	padding-bottom: 1%;
	border-top: solid 1px var(--text);
	line-height: 1.7;
}



.detail img{
	margin-top: 2%;
}

.detail_map{
	margin-top: 5%;
}


.part_order{
	margin-top: 9%;
}

.part05 .area_top img{
	margin-top: 2%;
}

.part05 .area_top img:last-of-type{
	margin-top: 7%;
}


.part05_area{
	background-color: #fff;
	margin-top: 5%;
	padding: 6% 5%;

}

.part05_area p:first-of-type{
	border-bottom: solid 1px var(--text);
	padding-bottom: 1%;
	font-size: clamp(1.8rem, 2.2vw, 2.2rem);
	font-weight: 700;
	line-height: 1.4;
}

.part05_area p:last-of-type{
	padding-top: 1%;
	font-size: clamp(1.6rem, 2vw, 2rem);
	line-height: 1.6;
}

.wrap_ce02{
	width: 90%;
    margin: 0 auto;
	padding-top: 5%;
}


.wrap_ce02 p{
	font-size: clamp(1.8rem, 2.4vw, 2.4rem);
	font-weight: 700;
	margin-bottom: 2%;
}

.wrap_ce02 img{
	margin-bottom: 7%;
}

.foot{
	width: 90%;
    margin: 0 auto;
	padding-bottom: 20%;
	text-align: center;
}

.foot img{
	width: 230px;
	
}

.foot p{
	font-size: clamp(1.5rem, 2.2vw, 2.2rem);
	padding-top: 3%;
}






@media (max-width: 768px) {
	.sp{
		display: block;
	}

	.pc{
		display: none;
	}

		.pa_whi_area{
		margin-top: 12%;
	}


	.top_up{
		height: 70vh;
	}

	.wrap_ce{
		width: 88%;
	}

	.part01_btn{
		width: 90%;

	}



	.part02_img img{
		margin-left: 5%;
		height: 180px;
	}

	.reverse .part02_img img{
		height: 180px;
    	margin-left: -5%;
	}


	.part02_num{
		width: 30px;
	}

.pa_bei_area__t{
	margin-top: 14%;
}

	.part05_area p:first-of-type{
	padding-bottom: 2%;

}

.part05_area p:last-of-type{
	padding-top: 2%;
}

.num_01{
	top: -8%;
	left: 5%;
}

.num_02{
	top: -7%;
	right: 4%;
}



.foot img{
	width: 47%;
}







}








#pageTop {
  position: fixed;
  bottom: 30px;
  right: 30px;
}

#pageTop a {
  display: block;
  z-index: 999;
  padding: 9px 0 0 1px;
  border-radius: 40px;
  width: 45px;
  height: 45px;
  background-color: #0f345b;
  color: #fff;
  font-size: 12px;
  line-height: 0.9em;
  text-align: center;
   font-family: "Zen Kaku Gothic Antique", sans-serif;
  font-weight: 500;
}


@media (max-width: 768px) {
	#pageTop {
	  position: fixed;
	  bottom: 15px;
	  right: 15px;
	}
}/* @media閉じタグ */


@media (min-width: 769px) {
	/* 
	a[href*="tel:"] {
	pointer-events: none;
	cursor: default;
	text-decoration: none;
	color: #fff;
	}
	}
 */
	.tel a{
		color: #fff;
	}

}

.slick-next:before, .slick-prev:before {
	color: #000;
}