html{
    font-size: 62.5%;
}

body{
    color: #333;
	background: #fff;
	-webkit-font-smoothing: antialiased;/*アンチエイリアスを滑らかに*/
	-moz-osx-font-smoothing: grayscale;
	line-height: 1.9;
	font-size: 1.6rem;
	font-family:"Zen Kaku Gothic New", sans-serif;
	font-weight: 500;
	font-style: normal;
    overflow-x: hidden;
}

h3{
    font-weight: 700;
}

*{
	margin: 0;
	box-sizing: border-box;
}

a{
	text-decoration: none;
	color: #333;
	transition: .4s;
}

ul,ol{
	list-style: none;
	padding: 0;
}
svg{
	padding: 0;
	margin: 0;
	vertical-align: bottom;
	min-height: 0%;
}
img{
  	line-height: 1;
	vertical-align: top;
	max-width: 100%;
	transition: .4s;
	font-size: 0;
}



.inner{
	width: 96%;
	max-width: 1200px;
	margin: 0 auto;
}

.inner.wide{
	max-width: 1400px;
    margin: 0 auto;
}
.inner.max{
	max-width: none;
}

.inner_w{
    width: 100%;
    margin: 0 auto;
}

.bold{
    font-weight: 500;
}

.filter {
	filter: brightness(114%) contrast(99%) saturate(72%);
  }


.flex_center{
	display: flex;
	justify-content: center;
}

.flex{
    display: flex;
}

.flex_end{
	display: flex;
	justify-content: flex-end;
}

.flex_start{
	display: flex;
	justify-content: flex-start;
}

.flex_bet{
	display: flex;
	justify-content: space-between;
}

.flex_ar{
	display: flex;
	justify-content: space-around;
}

section{
    padding: 100px 0;
}

.en{
    font-family: "Josefin Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
}

/*2行の基本Table*/
.info_table{
	width: 100%;
	table-layout: fixed;
	border-collapse: collapse;
}
.info_table tr{
	border: 1px solid #ccc;
}
.info_table th,
.info_table td{
	padding: 15px 10px;
	letter-spacing: 0.08em;
}
.info_table th{
	background: #f5f5f5;
	width: 30%;
	border-right: 1px solid #ccc;
	font-weight: 500;
}
.info_table td{
	background: #fff;
	width: 70%;
	border-right: 1px solid #ccc;
	border-left: 1px solid #ccc;
}
@media (max-width: 750px){
	.info_table{
		font-size: 0.9rem;
	}
}



/*ver2*/
.info_table02{
	width: 100%;
	table-layout: fixed;
	border-spacing: 0 6px;
    margin-top: 60px;
}
.info_table02 tr{
}
.info_table02 tr:last-child{
	border-bottom: none !important;
}
.info_table02 th,
.info_table02 td{
	padding: 18px 0;
	letter-spacing: 0.08em;
	font-size: 1.8rem;
}
.info_table02 th{
	position: relative;
	background: #269eed;
	width: 200px;
	font-weight: 500;
	color: #fff;
}
.info_table02 th::after{
    position: absolute;
    top: calc(50% - 10px);
    right: -8px;
    display: block;
    width: 0;
    height: 0;
    content: "";
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-left: 10px solid #269eed;
}
.info_table02 td{
	padding-left: 20px;
	padding-right: 20px;
	background: rgb(223, 223, 109,0.2);
}
@media (max-width: 750px){
	.info_table02 tr{
		border-width: 4px;
	}
	.info_table02 th,
	.info_table02 td{
		padding: 18px 0;
		font-size: 1.6rem;
	}
	.info_table02 th{
		width: 120px;
	}
	.info_table02 td{
		padding-left: 20px;
		padding-right: 20px;
	}
}

.info_table03{
	width: 100%;
	table-layout: fixed;
	border-collapse: collapse;
	border-bottom: 1px solid #bababa;
}
.info_table03 tr{
	border-top: 1px solid #bababa;
}
.info_table03 th,
.info_table03 td{
	padding: 30px 0;
	text-align: left;
	vertical-align: top;
	letter-spacing: 0.08em;
}
.info_table03 th{
	width: 20%;
	padding-left: 40px;
	font-weight: 500;
}
.info_table03 td{
	width: 80%;
	padding-left: 20px;
    font-weight: bold;
    text-align: center;
}
@media (max-width: 750px){
	.info_table03 th,
	.info_table03 td{
		padding: 40px 0;
	}
	.info_table03 th{
		width: 25%;
		padding-left: 20px;
	}
	.info_table03 td{
		width: 75%;
		padding-left: 20px;
	}
}
@media (max-width: 450px){
	.info_table03{
		font-size: 0.9rem;
		padding: 30px 0;
	}
	.info_table03 th{
		width: 30%;
		padding-left: 10px;
	}
	.info_table03 td{
		width: 70%;
		padding-left: 10px;
	}
}

/*フェードイン*/
.flowup{
	opacity: 0;
	transform: translateY(10px);
	transition: opacity 1.6s, transform 1.2s;
	transition-delay: 0.4s;
}
.flowup.inview{
	opacity: 1;
	transform: translateY(0);
}


.delay1{
	transition-delay: 0.8s;
}
.delay2{
	transition-delay: 1.1s;
}
.delay3{
	transition-delay: 1.8s;
}

.br{
    display: block;
}

.sp_br2{
    display: block;
}

.inner_u{
    width: 97%;
}

.sub_ttl{
    font-size: 4.8rem;
    letter-spacing: 1.5px;
    line-height: 50px;
    color: #289eed;
    font-weight: 700;
    margin-bottom: 60px;
    position: relative;
    font-family: "Josefin Sans", sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
    font-weight: 700;
}

.sub_ttl span{
    font-size: 2rem;
    font-family:"Zen Kaku Gothic New", sans-serif;
}

.sub_ttl2{
    padding: 1rem 2rem;
  border-left: 7px solid #269eed;
  background:rgb(218, 239, 253);
  letter-spacing: 2px;
  font-size: 3rem;
  margin-bottom: 60px;
}

@media (max-width: 650px){
    .sub_ttl2{
        font-size: 2.4rem;
    }
}


.sub_ttl3{
	font-size: 2.8rem;
	position: relative;
	letter-spacing: 3px;
	padding: 0 10px 8px;
	width: fit-content;
	margin: 0 auto 70px;
    font-weight: 500;
}

.sub_ttl3:after {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 10px;
	content: '';
	background-image: -webkit-repeating-linear-gradient(135deg, #269eed, #269eed 1px, transparent 2px, transparent 5px);
	background-image: repeating-linear-gradient(-45deg, #269eed, #269eed 1px, transparent 2px, transparent 5px);
	background-size: 7px 7px;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
  }

  @media (max-width: 650px){
    .sub_ttl3{
        font-size: 2.4rem;
    }
}

section{
    padding: 150px 0;
}

/*スライダー*/

.top_slider{
	position: relative;
    z-index: 2;
}


.top_slider .slider{
    width: 80%;
    margin: 0 0 0 auto;
}
.top_slider .slider li{
	width: 100%;
	height: calc(100vh - 160px);
    margin-top: 160px;
	min-height: 400px;
	background-size: cover;
}
.top_slider .slider li.top01{
	background-image: url(../img/top01.jpg);
    background-position: right top;
}
.top_slider .slider li.top02{
	background-image: url(../img/top02.jpg);
    background-position: right center;
}
.top_slider .slider li.top03{
	background-image: url(../img/top03.jpg);
    background-position: right;
}
.top_slider .slider li.top04{
	background-image: url(../img/top04.jpg);
    background-position: center;
}
/* .top_slider .slider li.top01{
	background-image: linear-gradient(rgba(0,0,0,0.35),rgba(0,0,0,0.35)),url(../img/sample02.jpg);
}
.top_slider .slider li.top02{
	background-image: linear-gradient(rgba(0,0,0,0.35),rgba(0,0,0,0.35)),url(../img/sample02.jpg);
}
.top_slider .slider li.top03{
	background-image: linear-gradient(rgba(0,0,0,0.35),rgba(0,0,0,0.35)),url(../img/sample02.jpg);
} */

/*キャッチ*/
.top_slider .catch{
	position: absolute;
    text-shadow: #fff 0px 0px 5px,#fff 0px 0px 5px,#fff 0px 0px 5px,#fff 0px 0px 5px,#fff 0px 0px 5px;
	top: 56%;
	left: 6%;
	transform: translate(0,-50%);
	pointer-events: none;
	z-index: 2;
    font-size: 5rem;
    font-weight: 700;
    letter-spacing: 8px;
    line-height: 100px;
    color: #4ab2f8;
	animation: apper 2.5s ease-in-out;
}

.top_slider .catch p:last-child{
    font-size: 2.8rem;
    line-height: 60px;
    margin-top: 40px;
}





/* .top_slider .catch::before{
    content: "";
    position: absolute;
    background: url(../img/catch_bg.png);
    background-position: center;
    background-size: cover;
    display: inline-block;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 850px;
    height: 738px;
    z-index: -1;
    opacity: 0.2;
} */

@media (max-width: 980px){
    .top_slider .catch::before{
        width: 117%;
        height: 152%;
    }
}

@keyframes apper {
	0% {
		opacity: 0;
	}
	50%{
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

/*=== 9-1-2 丸が動いてスクロールを促す ====*/

/*スクロールダウン全体の場所*/
.scrolldown2{
    /*描画位置※位置は適宜調整してください*/
	position:absolute;
    transform: translate(-50%,-50%);
	bottom:8%;
	left:9%;
    z-index: 3;
    font-family: "Josefin Sans", sans-serif;
}

/*Scrollテキストの描写*/
.scrolldown2 span{
    /*描画位置*/
	position: absolute;
	left:10px;
	bottom:10px;
    /*テキストの形状*/
	color: #000;
	font-size: 1.4rem;
	font-weight: 900;
	letter-spacing: 0.05em;
	/*縦書き設定*/
	-ms-writing-mode: tb-rl;
    -webkit-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
}

/* 丸の描写 */
.scrolldown2:before {
    content: "";
    /*描画位置*/
    position: absolute;
    bottom:0;
    left:-4px;
    /*丸の形状*/
	width:10px;
	height:10px;
	border-radius: 50%;
	background:#000;
    /*丸の動き1.6秒かけて透過し、永遠にループ*/
	animation:
		circlemove 1.6s ease-in-out infinite,
		cirlemovehide 1.6s ease-out infinite;
}

/*下からの距離が変化して丸の全体が上から下に動く*/
@keyframes circlemove{
      0%{bottom:45px;}
     100%{bottom:-5px;}
 }

/*上から下にかけて丸が透過→不透明→透過する*/
@keyframes cirlemovehide{
      0%{opacity:0}
     50%{opacity:1;}
    80%{opacity:0.9;}
	100%{opacity:0;}
 }

/* 線の描写 */
.scrolldown2:after{
	content:"";
    /*描画位置*/
	position: absolute;
	bottom:0;
	left:0;
    /*線の形状*/
	width:2px;
	height: 50px;
	background:#000;
}




@media (max-width: 1200px){
    .top_slider .slider li{
        margin-top: 75px;
    }

    .scrolldown2{
        left: 50%;
    }

    .top_slider .catch p{
        font-size: 4.2rem;
    }
    .top_slider .catch p:last-child{
        font-size: 2.2rem;
    }
}

@media (max-width: 980px){
    .top_slider .slider{
        width: 100%;
    }
    .top_slider .catch p{
        width: 100%;
        left: 0;
        display: flex;
        justify-content: center;
    }
    .top_slider .catch{
        transform: translate(-50%,-50%);
        top: 53%;
        left: 50%;
        width: 100%;
    }
}

@media (max-width: 750px){
	.top_slider .slider li{
		height: 60vh;
	}
    .scrolldown2{
        bottom: 12%;
    }
    .top_slider .catch p{
        line-height: 70px;
    }
    .top_slider .catch p:last-child{
        line-height: 40px;
    }
}

@media (max-width: 550px){
    .top_slider .catch p{
        font-size: 3.2rem;
        letter-spacing: 3px;
        line-height: 55px;
    }
    .top_slider .catch p:last-child{
        font-size: 1.8rem;
        letter-spacing: 3px;
        line-height: 30px;
    }
    .scrolldown2{
        bottom: 7%;
    }
}

@media (max-width: 385px){
    .top_slider .catch p{
        font-size: 2.6rem;
        letter-spacing: 1px;
    }
    .top_slider .catch p:last-child{
        font-size: 1.6rem;
        letter-spacing: 1px;
        margin-top: 20px;
    }
}

main{
    overflow-x: hidden;
}

.pan{
	width: 100%;
	position: absolute;
	left: 50%;
	bottom: 20px;
	transform: translateX(-50%);
}

.pan li:not(:last-child)::after{
	content: "＞";
	padding: 0 0.2em;
	position: absolute;
	top: 0;
}



/* .pan::before{
	content: "";
	background: url(../img/pan_neko.png);
	position: absolute;
	top: -200px;
	left: 30vw;
	background-size: cover;
	background-position: center;
	width: 150px;
	height: 170px;
} */

.pan li:not(:last-child){
	padding-right: 20px;
	position: relative;
}

.page_hd ol{
	display: flex;
	font-size: 1.4rem;
	justify-content: center;
}

.page_hd ol a{
	color: #fff;
}

.page_hd{
	padding-top: 270px;
	padding-bottom: 102px;
	width: 100%;
	position: relative;
	color: #fff;
	z-index: 0;
}

.page_hd::before{
	display: block;
	content: "";
	position: absolute;
	bottom: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background-image: linear-gradient(33deg, rgba(176, 238, 182, 1), rgba(33, 211, 234, 1) 48%, rgba(4, 202, 255, 1));
	z-index: -1;
}



.page_hd h2{
	font-size: 4rem;
	text-align: center;
	letter-spacing: 3px;
}

@media (max-width: 1200px){
    .page_hd{
        padding-top: 177px;
    }
}

.neko{
    z-index: 5;
}

.topics .inner_u{
    margin: 0 auto;
}

@media (max-width: 980px){
    .topics .flex_bet{
        flex-direction: column;
    }

    .topics .sub_ttl{
        text-align: center;
    }
}

/*about_us*/
.about_us .inner_u::before{
    content: "";
    display: block;
    position: absolute;
    top: -7vh;
    right:1vw;
    background-color: rgb(74, 178, 248,0.7);
    max-width: 1400px;
    width: 90vw;
    height: 1100px;
    border-radius: 56% 44% 49% 51% / 54% 50% 50% 46% ;
    z-index: -1;
}

.about_us .left{
    width: 48%;
}

.about_us .inner_u{
    z-index: 1;
    position: relative;
}

.about_us .right{
    width: 48%;
    color: #fff;
}

.about_us .sub_ttl{
    color: #fff;
}

.about_us h3{
    font-size: 3.2rem;
}

.about_us .img_box .b{
    width: 90%;
}

.about_us .img_box .s{
    width: 75%;
    margin: 50px 0  0 auto;
}

.about_us .txt_box{
    max-width: 800px;
    margin: 140px auto 0;
}

.about_us .txt_box p{
    margin-top: 30px;
    line-height: 2.6;
}

.about_btn{
    margin: 100px auto 0;
    width: fit-content;
}

.btn_a{
    height: 60px;
    position: relative;
    outline: none;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
    transition: all 0.3s ease;
    font-size: 2.2rem;
    color: #fff;
}

.btn_a .arrow{
    width: 60px;
    height: 60px;
    position: relative;
    display: grid;
    place-items: center;
    background-color: #fff;
    border-radius: 30px;
    overflow: hidden;
}

.btn_a .arrow span{
    margin-left: 7px;
    clip-path: polygon(0 7%, 7% 0, 57% 50%, 7% 100%, 0 93%, 43% 50%, 0 7%);
    height: 14px;
    aspect-ratio: 1;
    background-color: #4ab2f8;
}

.btn_a .arrow_item02{
    position: absolute;
    transform: translateX(-400%);
}

.btn_a:hover .arrow_item01{
    transition: transform 0.3s ease-in-out;
    transform: translateX(400%);
}

.btn_a:hover .arrow_item02{
    transition: transform 0.3s ease-in-out 0.1s;
    transform: translate(0);
}

.about_us .neko{
    width: 180px;
    position: absolute;
    bottom: -10%;
    right:10%;
}

.block{
    display: block;
}

@media (max-width: 1650px){
    .about_us .neko{
        bottom: -20%;
    }
}

@media (max-width: 1500px){

    .about_us .inner_u::before{
        right: -9vw;
    }
    .about_us h3 span{
        display: block;
    }
    
}

@media (max-width: 1300px){
    .sub_ttl{
        font-size: 3.8rem;
    }
    .about_us h3{
        font-size: 2.8rem;
    }
    .about_us .inner_u{
        width: 100%;
    }
    .about_us .img_box .b{
        width: 100%;
    }
    .about_us .left{
        width: 45%;
    }
    .about_us .img_box .b{
        margin-top: 90px;
    }
}

@media (max-width: 980px){
    .about_us .flex_bet{
        flex-direction: column-reverse;
    }
    .about_us .right{
        width: 70%;
    }
    .about_us .inner_u::before{
        right: auto;
        left: -20vw;
        width: 110vw;
        height: 1000px;
        top: -10vh;
    }
    .about_us .left{
        width: 100%;
    }
    .about_us .txt_box{
        margin-top: 50px;
        margin:  50px 140px 0 70px;
    }
    .about_us .img_box .b{
        width: 70%;
        margin: 90px 0 0 auto;
    }
    .about_us .img_box .s{
        width: 50%;
    }
    .about_us .sub_ttl{
        font-size: 4rem;
    }
    .about_us h3{
        font-size: 3.2rem;
    }
    .about_us .neko{
        bottom: -100px;
        left: 10%;
        transform: scale(-1,1);
    }
}

@media (max-width: 700px){
    .about_us .right, .about_us .left{
        width: 96%;
        margin: 0 auto;
    }
    .about_us .inner_u::before{
        width: 170vw;
        left: -60vw;
    }
    .about_us .img_box .b{
        width: 100%;
    }
    .about_us .img_box .s{
        width: 75%;
    }
    .about_us h3{
        font-size: 2.4rem;
    }
    .about_us .neko{
        width: 120px;
        bottom: -160px;
    }
    
}

@media (max-width: 450px){
    .about_us .inner_u::before{
        height: 1200px;
        width: 320vw;
        left: -180vw;
    }
}

/*achieve*/

.achieve{
    background-image: linear-gradient(rgba(255,255,255,0.6),rgba(255,255,255,0.6)),url(../img/achieve.jpg);
    background-size: cover;
    background-position: center;
    margin-top: 100px;
    position: relative;
}

.achieve .sub_ttl::before{
    content: "";
    display: inline-block;
    width: 230px;
    height: 230px;
    position: absolute;
    background: url('../img/nekoashi_01.png') no-repeat center center / contain;
    top: -320%;
    right: 30%;
    z-index: 3;
}

.achieve .inner_u{
    margin: 0 0 0 auto;
}

.achieve ul{
    font-size: 1.8rem;
}

.achieve ul .flex_bet li{
    width: 30%;
    padding: 10px 0;
    border-bottom: #269eed solid 2.5px;
    background-color: #fff;
    text-align: left;
    padding-left: 50px;
    position: relative;
    border-radius: 2px;
}

.achieve ul .flex_bet li::before{
    content: "";
    position: absolute;
    display: inline-block;
    width: 15px;
    height: 15px;
    background: url(../img/check.png);
    background-size: cover;
    background-position: center;
    top: 21px;
    left: 20px;
}

.achieve ul .flex_bet+.flex_bet{
    margin-top: 20px;
}

.achieve_box{
    margin: 0 auto;
    text-align: center;
    position: relative;
}

.achieve .sub_ttl{
    text-align: center;
    margin-bottom: 60px;
}




.achieve h3{
    font-size: 3rem;
    padding: 10px 0;
    margin-bottom: 20px;
    font-weight: 500;
}

.daigaku{
    margin-top: 60px;
}

.achieve .achieve_box h3 span.hand{
    content: "";
    display: inline-block;
    background: url(../img/nekonote.png);
    background-size: cover;
    background-position: center;
    width: 40px;
    height: 40px;
    margin-right: 12px;
}

span.marker ,td.marker{
    background: linear-gradient(transparent 50%, rgb(255, 255, 0,0.8) 50%);
}


.achieve_btn{
    margin-top: 100px;
}

.achieve_btn.btn_a{
    font-size: 1.6rem;
    color: #000;
}

.achieve .btn_box{
    width: 500px;
    position: relative;
    margin: 0 auto;
}

.achieve_btn.btn_a .arrow{
    background-color: #4ab2f8;
}

.achieve_btn.btn_a .arrow span{
    background-color: #fff;
}

.achieve .neko {
    width: 200px;
    position: absolute;
    left: 15%;
    bottom: -60px;
    transform: translateY(60%);
}

.achieve .inner_u{
    position: relative;
    z-index: 2;
}

@media (max-width: 980px){
    .achieve .flex_bet{
        flex-direction: column;
        width: 100%;
    }
    .achieve .left, .achieve .right{
        width: 100%;
    }
    .achieve .right{
        height: 300px;
    }
    .achieve h3{
        font-size: 2.4rem;
    }
    .achieve ul{
        font-size: 1.6rem;
    }
    .achieve .inner_u{
        margin: 0 auto;
    }
    .achieve .sub_ttl::before{
        right: 17%;
        top: -260px;
    }
    .achieve .achieve_box .flex_bet li{
        width: 100%;
    }

    .achieve_btn:first-child{
        margin-top: 70px;
    }

    .achieve_btn:last-child{
        margin-top: 40px;
    }

    .achieve ul .flex_bet{
        flex-direction: column;
    }
    .achieve h3{
        margin-right: 0;
    }
    .achieve .achieve_box .flex_bet{
        width: 100%;
    }
    .achieve ul .flex_bet+.flex_bet{
        margin-top: 0;
    }
    .achieve .achieve_box .flex_bet li{
        margin-top: 10px;
    }
}

@media (max-width: 700px){

    .achieve .neko{
        width: 150px;
        bottom: -40px;
    }
    .achieve .flex_ar{
        flex-direction: column;
    }
    .achieve_btn+.achieve_btn{
        margin-top: 30px;
    }
}

@media (max-width: 500px){
    .achieve_box{
        flex-direction: column;
    }
    .achieve .koukou,.achieve .daigaku{
        width: 100%;
    }
    .achieve .daigaku{
        margin-top: 30px;
    }
    .achieve .sub_ttl{
        margin-bottom: 40px;
    }
    .achieve .left{
        padding-bottom: 50px;
    }
   
}

/*price*/

.price{
    background-size: 16px 16px;
    background-position: 50% 50%;
    background-image: repeating-linear-gradient(90deg, rgba(0, 0, 0, 0.03), rgba(0, 0, 0, 0.03) 1px, transparent 1px, transparent 16px), repeating-linear-gradient(0deg, rgba(0, 0, 0, 0.03), rgba(0, 0, 0, 0.03) 1px, #fff 1px, #fff 16px);
}

.price .sub_ttl{
    text-align: center;
    margin-bottom: 60px;
}

.price .flex_center .course_item{
    box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;
}


.price .flex_center .course_item+.course_item{
    margin-left: 8px;
}

.price .left{
    width: 30%;
}

.price .right{
    width: 66%;
    padding: 100px 0;
}

.price .course_item img{
    width: 100px;
}

.price .course_item {
    font-size: 2rem;
}

.price .des{
    font-size: 1.8rem;
    margin-top: 100px;
    letter-spacing: 3px;
}

.price .des ul{
    width: fit-content;
    margin: 0 auto;
}

.price .des li{
    padding: 20px 12px;
}

.price .des li+li{
    border-top: 1px solid #000;
}

.price .des li:first-child{
    border-top: 1.5px solid #000;
}

.price .des li:last-child{
    border-bottom: 1.5px solid #000;
}

.price .attention{
    margin-top: 50px;
    margin-bottom: 100px;
    text-align: center;
}

.price_side{
    background: url(../img/price_side.jpg);
    background-size: cover;
    background-position-x: 75%;
}

.price_btn.btn_a{
    color: #333;
    font-size: 1.6rem;
}

.price_btn.btn_a .arrow{
    background-color: #4ab2f8;
}

.price_btn.btn_a .arrow span{
    background-color: #fff;
}

.price .inner_w{
    position: relative;
}

.price .neko{
    width: 85px;
    position: absolute;
    bottom: -200px;
    right: 40%;
}

.price .sub_ttl::before {
    content: "";
    display: inline-block;
    width: 230px;
    height: 230px;
    position: absolute;
    background: url(../img/nekoashi_01.png) no-repeat center center / contain;
    top: -250px;
    left: 5%;
    transform: scale(-1, 1);
}

.price .course_item{
    padding: 30px 80px;
}

.price .course_item.l{
    background: rgb(255, 228, 225);
    border-top: solid 5px #ec8b80;
}
.price .course_item.m{
    background: rgb(224, 255, 255);
    border-top: solid 5px rgb(92, 217, 217);
}
.price .course_item.s{
    background: #ffffe0;
    border-top: solid 5px #dfdf6d;
}

.price .course_item .img{
    text-align: center;
    margin-bottom: 10px;
}

@media (max-width: 1425px){
    .price .flex_bet{
        flex-direction: column;
    }
    .price .left, .price .right{
        width: 96%;
        margin: 0 auto;
    }
    .price .left{
        aspect-ratio: 5 / 3;
    }
    .price .des{
        font-size: 1.6rem;
    }
}

@media (max-width: 1350px){
    .price .course_item{
        padding: 25px 50px;
    }
    .price .course_item .img{
        width: 60%;
        margin: 0 auto 10px;
    }
    .price .course_item{
        font-size: 1.8rem;
    }
}


@media (max-width: 980px){
    
}

@media (max-width: 700px){
    .price .des{
        font-size: 1.6rem;
        margin-top: 50px;
    }
    .none{
        display: none;
    }
    .sp_br{
        display: block;
        font-size: 1.8rem;
        margin-bottom: 10px;
    }
    .sp_br2{
        display: inline;
    }
    .price .flex_center{
        flex-direction: column;
    }
    .price .course_item p{
        text-align: center;
        font-size: 2rem;
    }

    .achieve_btn{
        margin-top: 60px;
    }
    .price .neko{
        width: 70px;
        bottom: -150px;
    }
    .price .flex_ar{
        flex-direction: column;
    }
    .price .flex_ar a+a{
        margin-top: 60px;
    }
    .price .flex_center .course_item+.course_item{
        margin-left: 0;
        margin-top: 30px;
    }
    .price .attention{
        margin-bottom: 0;
    }
    .price_btn.btn_a+.price_btn.btn_a{
        margin-top: 40px;
    }
}

/*welcome*/

.welcome_btn.btn_a{
    color: #333;
    font-size: 1.6rem;
    align-items: center;
    width: 60%;
    justify-content: flex-end;
}

.welcome_btn.btn_a .arrow{
    background-color: #4ab2f8;
}

.welcome_btn.btn_a .arrow span{
    background-color: #fff;
}

.welcome .left{
    width: 38%;
}
.welcome .right{
    width: 56%;
    background: url(../img/bosyu.jpg);
    background-size: cover;
    background-position: center;
}

.welcome .inner_u{
    margin: 0 0 0 auto;
}

.welcome_btn{
    width: fit-content;
}

.welcome h2{
    font-size: 3.2rem;
    font-weight: normal;
    text-align: center;
    position: relative;
    color: #289eed;
    letter-spacing: 3px;
}

.welcome h3{
    font-size: 3.2rem;
    color: #289eed;
    margin-top: 30px;
    text-align: center;
    letter-spacing: 3px;
}

.welcome .txt_box p{
    text-align: center;
    margin-top: 40px;
    line-height: 2.6;
}

.welcome .txt_box p span{
    display: block;
}

.welcome .txt_box{
    padding: 100px 0;
}

.welcome .btn_box{
    margin-top: 100px;
    position: relative;
    align-items: center;
}

.welcome_logo{
    width: 40%;
    text-align: center;
}

.welcome_logo img{
    width: 40%;
    
}



.welcome h2::before{
    content: "";
    display: inline-block;
    width: 230px;
    height: 230px;
    position: absolute;
    background: url('../img/nekoashi_01.png') no-repeat center center / contain;
    top: -450%;
    right: 10%;
}

@media (max-width: 1725px){
    .welcome .right{
        width: 52%;
    }
    .welcome .left{
        width: 46%;
    } 
}

@media (max-width: 1425px){
    .welcome .txt_box p{
        text-align: left;
    }
    .welcome .txt_box p span{
        display: inline;
    }
    .welcome .flex_bet{
        flex-direction: column-reverse;
    }
    .welcome .left, .welcome .right{
        width: 100%;
        aspect-ratio: 5 / 3;
    }
    .welcome .txt_box{
        padding-top: 100px;
    }
    .welcome .txt_box p{
        text-align: center;
    }
    .welcome .txt_box p span{
        display: block;
    }
    .welcome .left{
        height: auto;
    }
    section.welcome{
        padding-bottom: 0;
    }
    .welcome .inner_u{
        margin: 0 auto;
    }
    .welcome h2::before{
        top: -250px;
        right: 17%;
    }
    .welcome_btn.btn_a{
        justify-content: center;
    }
    .welcome .btn_box{
        margin-top: 50px;
    }
    .welcome_logo{
        width: 100%;
    }

    .welcome_logo img{
        max-width: 100px;
    }

    .welcome_btn.btn_a{
        width: 100%;
        margin-top: 40px;
    }
}

@media (max-width: 980px){
    
}

@media (max-width: 700px){
    .welcome h3{
        font-size: 2.2rem;
    }
    .welcome h2{
        font-size: 3rem;
    }
    body{
        font-size: 1.5rem;
    }
    section{
        padding: 100px 0;
    }
    .achieve .sub_ttl::before,.price .sub_ttl::before,.welcome h2::before{
        width: 170px;
    }
    .welcome h2::before{
        top: -220px;
    }
    .welcome .btn_box{
        margin-top: 30px;
    }
}



footer{
    background-image: linear-gradient(rgba(0,0,0,0.6),rgba(0,0,0,0.6)),url(../img/footer_bg.jpg);
    background-size: cover;
    background-position-y: center;
    width: 100%;
    color: #fff;
    text-align: top center;
    padding-top: 80px;
}


footer a{
    color: #fff;
}

footer p{
    font-size: 2.2rem;
    text-align: center;
}


footer .copy p{
    font-size: 1.5rem;
    padding: 40px 0;
}

footer .logo{
    width: 250px;
    margin: 0 auto;
    padding-bottom: 50px;
}

footer .tel{
    letter-spacing: 2px;
    margin-top: 10px;
    margin-bottom: 20px;
    font-size: 2.4rem;
}

.page_top a span::before{
	content: "";
	display: none;
	background: url(../img/pagetop.png);
	background-size: cover;
    background-position: center;
	width: 70px;
	height: 40px;
	position: fixed;
	bottom: 7vh;
	right: 3.5vw;
	z-index: 3;
	transition: all .4s;
}

.page_top.is_animation a span::before{
	display: inline-block;
}



.page_top a span:hover::before{
	opacity: 0.7;
}

@media (max-width: 700px){
    .page_top a span::before{
        width: 46px;
        height: 27px;
    }
}

.foo_inner{
    width: 96%;
    margin: 0 auto;
}

@media (max-width: 500px){
    footer .logo{
        width: 200px;
    }
    footer p{
        font-size: 1.8rem;
    }
    .sp_br3{
        display: block;
        font-size: 2.4rem;
    }
    .btn_a{
        margin-top: 50px;
    }
}

@keyframes GradientBackground {
    0% {
      background-position: 0% 50%;
    }
  
    50% {
      background-position: 100% 50%;
    }
  
    100% {
      background-position: 0% 50%;
    }
  };


  /*サブタイトル*/
  .sub_ttl{
    font-size: 4rem;
  }

  /*料金案内ページ*/

  section.flow, section.price_detail, section.touitu{
    padding: 75px 0;
  }
  
  .flow{
    position: relative;
  }

  .flow .inner_u{
    margin: 0 0 0 auto;
  }

  .flow .sub_ttl{
    margin-bottom: 140px;
  }

  .flow .sub_ttl2{
    margin-bottom: 120px;
  }

  .stepup{
    width: 94%;
    max-width: 1400px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-template-rows: 1fr;
    gap: -1% -1%;
    grid-auto-flow: row;
    grid-template-areas:
      "step1 step2 step3 step4";
  }
  
  .step1 { grid-area: step1; }
  
  .step2 { grid-area: step2; }
  
  .step3 { grid-area: step3; }
  
  .step4 { grid-area: step4; }

.stepbox{
    border-left: solid 1.75px #000;
}

.step_inner{
    width: 97%;
    margin: 0 auto;
}

.step_img{
    margin-top: -40px;
    margin-left: -20px;
    width: 130px;
}

.stepbox h3{
    font-size: 2.8rem;
    color: #2626af;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}

.h130{
    height: 130px;
    display: table;
    margin: 0 auto;
}


.step_icon{
    width: 30%;
    min-width: 100px;
    margin: 0 auto;
    margin-bottom: 20px;
}

.step_txt{
    width: 85%;
    margin: 0 auto;
    margin-bottom: 30px;
}

.flow .attention{
    text-align: right;
    margin-top: 120px;
    position: relative;
}

.flow .attention p{
    padding: 10px 0;
    font-size: 2.2rem;
    width: 94%;
}

.flow .attention p::before{
    content: "";
    border-bottom: solid 2px #000;
    width: 70vw;
    height: 2px;
    top: 30px;
    right: 15%;
    position: absolute;
}

.flow .attention p::after{
    content: "";
    border-right: solid 2px #000;
    display: inline-block;
    position: absolute;
    height: 500px;
    width: 2px;
    bottom: 90px;
    right: 3%;
    top: -465px;
}

.price_detail .sub_ttl2{

}

.price_detail .left{
    width: 50%;
}

.price_detail .left img{
    max-height: 420px;
    object-fit: cover;
    width: 100%;
}

.price_detail .right{
    position: relative;
    width: 48%;
    margin: 0 0 0 auto;
    display: flex;
    align-items: center;
}

.price_detail .right .in{
    width: 97%;
}

.price_detail .neko_line{
    display: block;
    position: static;
    margin-top: 40px;
    margin: 40px 20px 0 auto;
}

.price_table{
    width: 100%;
    font-size: 1.8rem;
    border-collapse: collapse;
    letter-spacing: 0.1em;
}

.price_table th{
    width: 40%;
}

.schedule h3::before{
    content: "";
    background: url(../img/check.png);
    background-size: cover;
    background-position: center;
    width: 16px;
    height: 16px;
    display: inline-block;
    margin-right: 10px;
}

.price_table td{
    width: 60%;
    text-align: left;
    padding-left: 15%;
}

.price_table tr{
    border-bottom: solid 1px #bababa;
}

.price_table td, .price_table th{
    padding: 1.25% 0;
}

.touitu .inner_w .left{
    margin: 0 auto;
    width: 60%;
}

.touitu .inner_w .right{
    background: url(../img/jump.jpg);
    width: 30%;
    background-size: cover;
    background-position: center;
}



.touitu .sub_ttl2{
    position: relative;
    margin-bottom: 40px;
}

.touitu .sub_ttl2::after{
    content: "";
    position: absolute;
    background: url(../img/touitu.jpg);
    top: 110px;
    right: 5%;
    width: 83px;
    height: 80px;
    background-size: cover;
    background-position: center;
}

.table_site table.p_table{
    width: 97%;
}

.p_table {
	border-collapse: collapse;
    width: 97%;
    margin: 60px auto 0;
    text-align: center;
    white-space: nowrap;
}
.p_table th {
	border: solid 1px #666666;
	color: #000000;
	background-color: #ff9999;
}
.p_table td {
	border: solid 1px #666666;
	color: #000000;
	background-color: #ffffff;
}

.zei{
    text-align: right;
}

.ad_txt{
    position: relative;
    font-size: 2.2rem;
    padding-left: 50px;
}

.ad_txt::after{
    content: "";
    display: inline-block;
    position: absolute;
    background: url(../img/nekonote.png);
    background-size: cover;
    background-position: center;
    aspect-ratio: 3 / 4;
    width: 35px;
    top: -8px;
    left: 0;
}

@media (max-width: 1450px){
    .touitu .sub_ttl2::after{
        top: 600px;
    } 
}

@media (max-width: 960px){
    .touitu .sub_ttl2::after{
        top: 330px;
    }
}

@media (max-width: 752px){
    .touitu .sub_ttl2::after{
        top: 360px;
    }
}
@media (max-width: 566px){
    .touitu .sub_ttl2::after{
        top: 420px;
    }
}
@media (max-width: 365px){
    .touitu .sub_ttl2::after{
        top: 510px;
    }
}

.touitu .f_txt{
    line-height: 2.1;
    margin-left: 10px;
}

.touitu .f_txt p:first-child{
    margin-bottom: 20px;
}

.touitu .schedule{
    margin-top: 40px;
    font-size: 1.8rem;
    margin-bottom: 20px;
}

.touitu .schedule h3{
    border-bottom: dashed 1.25px #333;
    margin-bottom: 10px;
}

.touitu .schedule .s_left ul{
    letter-spacing: 3px;
}

.schedule .s_right p:last-child{
    margin-top: 20px;
}

.touitu .s_left{
    width: 47%;
}

.touitu .s_right{
    width: 47%;
}

@media (max-width: 1200px){
    .stepup{
        width: 70%;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 1fr 1fr;
        gap: 5% 2%;
        grid-template-areas:
          "step1 step2"
          "step3 step4";
    }
    .stepbox{
        border-left: none;
        box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    }
    section.price_detail{
        padding: 0;
    }
    .price_detail .flex_bet{
        flex-direction: column;
    }
    .flow .attention p::before{
        left: 0;
    }
    .touitu .flex_bet:not(.flex_bet.schedule){
        flex-direction: column-reverse;
    }
    .touitu .inner_w, .price_detail .inner_w{
        width: 97%;
        margin: 0 auto;
    }
    .price_detail .right,.price_detail .left{
        width: 100%;
        margin-bottom: 50px;
    }
    .touitu .inner_w .right, .touitu .inner_w .left{
        width: 100%;
    }
    .price_detail .neko_line{
        bottom: -120px;
        max-width: 400px;
        width: 90%;
    }
    .p_table{
        margin-top: 0;
    }
}


@media (max-width: 960px){
    .stepup {
        margin: 0 5% 0 auto;
        grid-template-columns: 1fr;
        grid-template-rows: 1fr 1fr 1fr 1fr;
        gap: 2% 2%;
        grid-template-areas:
          "step1"
          "step2"
          "step3"
          "step4";
    }
      
      .step1 { grid-area: step1; }
      
      .step2 { grid-area: step2; }
      
      .step3 { grid-area: step3; }
      
      .step4 { grid-area: step4; }
    
    .stepbox h3{
        font-size: 2.4rem;
    }
    .h130{
        height: 100px;
        line-height: 1.3;
    }
    .step_icon{
        width: 15%;
    }
    .step_img{
        position: absolute;
        left: 10%;
    }
    .schedule.flex_bet{
        flex-direction: column;
    }

    section.touitu{
        padding-top: 0;
    }

    .touitu .schedule.flex_bet .left ul{
        width: 95%;
        margin: 0 0 0 auto;
    }
    .touitu .schedule.flex_bet .right p{
        width: 95%;
        margin: 0 0 0 auto;
    }
    .touitu .schedule .s_left{
        width: 100%;
        margin: 40px auto 0;
    }
    .touitu .schedule .s_right{
        width: 100%;
        margin: 0 auto;
        margin-top: 20px;
    }
    .touitu .inner_w .right{
        margin-bottom: 50px;
    }
    .price_detail .neko_line{
        bottom: -100px;
    }
}

@media (max-width: 650px){
    .flow .attention p::after{
        display: none;
    }
    .flow .attention p::before{
        left: -20%;
    }
    .price_table{
        font-size: 1.6rem;
    }
    .ad_txt{
        font-size: 1.6rem;
    }
}

@media (max-width: 428px){
    .stepup{
        width: 97%;
        gap: 5%;
    }
    .flow .attention{
        margin-top: 200px;
    }

}


/*空き情報*/

.reserved{
    position: relative;
}

.neko_line{
    position: absolute;
    bottom: -30px;
    right: 5%;
    width: 500px;
    z-index: 2;
}

.reserved_table tr{
    background-color: #fff;
}

.reserved_table{
    font-size: 2rem;
}

.reserved .flex_bet .left{
    width: 49%;
}

.reserved .flex_bet .right{
    width: 49%;
}

.achieve.goukaku{
    background-image: none;
    background-color: #f5f5f5;
    margin-top: 0;
    padding: 75px 0;
}

.achieve.goukaku .sub_ttl2{
    padding: 1rem 2rem;
    font-size: 3rem;
}

section.voice{
    padding: 75px 0;
}

.voice .voice_box{
    width: 90%;
    margin: 0 auto;
}

.voice .voice_box .voice_box_inner{
    background-color: rgb(255, 243, 184,0.4);
    padding: 25px 40px;
    border-radius: 25px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.voice .voice_box h4{
    font-size: 2.2rem;
    border-bottom: dashed 1px #bababa;
    padding-bottom: 7px;
    margin-bottom: 20px;
    position: relative;
    padding-left: 60px;
}

.voice .voice_box h4::before{
    content: "";
    display: inline-block;
    position: absolute;
    background: url(../img/neko_hakusyu.png);
    background-size: cover;
    background-position: center;
    width: 40px;
    height: 60px;
    top: -10px;
    left: 0;
}

.voice .voice_box+.voice_box{
    margin-top: 40px;
}

.voice .txt{
    display: flex;
    justify-content: space-between;
}

.voice .txt .left{
    width: 25%;
    display: flex;
    align-items: center;
}

.voice .txt .right{
    width: 72%;
    display: flex;
    align-items: center;
}

@media (max-width: 960px){
    .neko_line{
        width: 90%;
        max-width: 400px;
    }
    .voice .txt .left{
        width: 40%;
    }
    .voice .txt .right{
        width: 57%;
    }
}

@media (max-width: 650px){
   .achieve.goukaku .sub_ttl2{
        font-size: 2.4rem;
    }
    .voice .txt{
        flex-direction: column;
    }
    .voice .txt .left{
        width: 85%;
        margin: 0 auto;
        margin-bottom: 20px;
    }
    .voice .txt .right{
        width: 100%;
    }
    .voice .voice_box .voice_box_inner{
        padding-left: 20px;
        padding-right: 20px;
    }
}

@media (max-width: 1250px){
    .reserved .flex_bet{
        flex-direction: column;
    }
    .reserved .flex_bet .left{
       width: 80%;
       margin: 0 auto;
       margin-bottom: 60px;
    }
    .reserved .flex_bet .right{
        width: 100%;
    }
    section.reserved{
        padding: 75px 0;
    }
}

/*各種講習*/

.cam{
    padding: 75px 0;
}

.cam p{
    font-size: 3rem;
    text-align: center;
}

section.kaki_kousyu, section.touki_kousyu{
    padding: 75px 0;
}



.kaki {
    border-collapse: collapse;
    width: 100%;
}
.kaki th {
    border: solid 1px #666666;
    color: #000000;
    background-color: #ff9999;
    padding: 0 5px;
}
.kaki td {
    border: solid 1px #666666;
    color: #000000;
    background-color: #ffffff;
    padding: 0 5px;
    min-width: 35px;
}

.kaki tr{
    text-align: center;
}

.kaki .tate td span{
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    text-orientation: upright;
}

.a_span{
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    text-orientation: upright;
}

.kaki  tbody tr:first-child td{
    text-align: center;
}

.kaki_content {
	border-collapse: collapse;
    width: 100%;
}
.kaki_content th {
	border: solid 1px #666666;
	color: #000000;
	background-color: #ff9999;
    padding: 0 5px;
}
.kaki_content td {
	border: solid 1px #666666;
	color: #000000;
    padding: 0 5px;
	background-color: #ffffff;
}

.kaki_content tr{
    text-align: center;
}

.wrapper .table_txt{
    margin-top: 40px;
}

.wrapper{
    margin-top: 75px;
}

.touki {
	border-collapse: collapse;
    width: 100%;
}

.touki th {
	border: solid 1px #666666;
	color: #000000;
	background-color: #ff9999;
    padding: 0 5px;
}
.touki td {
	border: solid 1px #666666;
	color: #000000;
	background-color: #ffffff;
    padding: 0 5px;
    min-width: 35px;
}

.touki tr{
    text-align: center;
}

.text-combine {
    -webkit-text-combine: horizontal;
    -ms-text-combine-horizontal: all;
    text-combine-upright: all;
  }

.touki_content {
	border-collapse: collapse;
    width: 100%;
}
.touki_content th{
	border: solid 1px #666666;
	color: #000000;
	background-color: #ff9999;
    padding: 0 5px;
}
.touki_content td{
	border: solid 1px #666666;
	color: #000000;
	background-color: #ffffff;
    padding: 0 5px;
}

.touki_content tr{
    text-align: center;
}

.table_wrap{
    overflow-x: scroll;
}

.table_site table{
    width: 100%;
    border-collapse: collapse;
    white-space: nowrap;
}

/*スクロールバー*/
.table_site table::-webkit-scrollbar{
    overflow: hidden;
    width: 1px;
    background: #fafafa;
}
.table_site table::-webkit-scrollbar-button {
    display: none;
}
.table_site table::-webkit-scrollbar-thumb, #newsWrap ul#newsList::-webkit-scrollbar-corner {
    background: #444;
}

.red{
    color: red;
    font-weight: bold;
}

.sp_txt{
    display: none;
    margin-top: 20px;
    font-size: 1.6rem;
    text-align: left;
    font-weight: bold;
}

@media (max-width: 1280px){
    .sp_txt.a{
        display: block;
    }
}

@media (max-width: 874px){
    .sp_txt.b{
        display: block;
    }
}
@media (max-width: 851px){
    .sp_txt.d{
        display: block;
    }
}
@media (max-width: 770px){
    .sp_txt.e{
        display: block;
    }
}
@media (max-width: 717px){
    .sp_txt.c{
        display: block;
    }
}

/*塾紹介*/
.juku_about .table_img img{
    width: 100%;
    height: 500px;
    object-fit: cover;
}

.juku_about .table_img{
    background: url(../img/top01.jpg);
    height: 500px;
    background-size: cover;
    background-position: top;
}

.juku_about{
    background-color: #f5f5f5;
    position: relative;
}

.neko_back{
    position: absolute;
    width: 170px;
    bottom: -70px;
    right: 10%;
}

section.greeting, section.garally, section.juku_about, section.map{
    padding: 75px 0;
}

.greeting .sub_ttl2{
    margin-bottom: 80px;
}

.greeting_txt{
    position: relative;
    background-color: #fff;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    line-height: 2.4;
    font-size: 1.8rem;
}

.greeting_txt .txt_inner{
    padding: 90px 4% 30px;
}

.daihyou{
    width: fit-content;
    margin: 30px 0 0 auto;
    line-height: 2;
}

.clip{
    position: absolute;
    top: -40px;
    left: -3%;
}

.clip img{
    width: 42%;
}

.gre_neko{
    position: absolute;
    bottom: 10px;
    right: -2%;
}

.gre_neko img{
    width: 23%;
}

.greeting{
    background-color: rgb(40, 158, 237,0.1);
}



@media (max-width: 650px){
    .greeting_txt{
        line-height: 1.9;
        font-size: 1.7rem;
    }
    .daihyou{
        margin-top: 65px;
    }
    .gre_neko{
        right: -17%;
    }
    .neko_back{
        width: 120px;
    }
}

@media (max-width: 428px){
    .gre_neko{
        left: 0;
    }
}

/*===ギャラリー部分==============================
============================================================*/
ul.gallery{
	display: flex;
	flex-wrap: wrap;
	margin-bottom: -10px;
}
ul.gallery li{
	width: calc(100% / 4 - 8px);
	margin: 4px;
}
ul.gallery li a{
	display: block;
	width: 100%;
	position: relative;
    overflow: hidden;
	min-height: 0%;
}
ul.gallery li a::before{
    content: '';
    display: block;
    padding-top: 80%;/*高さの比率*/
}
ul.gallery li a img{
	display: block;
	object-fit: cover;
	width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
	transition: 0.6s ease;
}
ul.gallery li p{
    font-size: 1.8rem;
    margin-top: 10px;
}
ul.gallery li a:hover img{
	transform: scale(1.1);
}
@media (max-width: 960px){
	ul.gallery li{
		width: calc(100% / 3 - 8px);
	}
}
@media (max-width: 750px){
	ul.gallery li{
		width: calc(100% / 2 - 8px);
	}
}
@media (max-width: 450px){
	ul.gallery li{
		width: calc(100% / 2 - 8px);
	}
}


/*お問い合わせページ*/

section.co_area{
    padding-top: 75px;
    padding-bottom: 0;
}

.co_area{
    background-color: #f5f5f5;
}

.co_area .inner p:first-child{
    margin-bottom: 80px;
    font-weight: bold;
}



.co_area .sub_ttl3{
    margin-bottom: 80px;
}

.co_tel_btn{
    text-align: center;
}

.co{
    width: 100%;
    margin: 0 auto;
}



.line_banner,.insta_banner{
    width: 200px;
}

.line_banner{
    margin-left: 10%;
}

.insta_banner{
    margin-right: 10%;
}

.co_box01,.co_box02{
    background-color: #fff;
    border-radius: 30px;
    padding: 50px 0;
}

.co_box01 .co_neko{
    position: absolute;
    width: 170px;
    bottom: 0;
    right: 4%;
}

.co_box01{
    position: relative;
}

.co_box02{
    position: relative;
}

.co_box02 .co_neko{
    position: absolute;
    width: 240px;
    transform: scale(-1, 1);
    bottom: -100px;
    left: -3%;
}

.co_box01 .attention{
    font-size: 2.4rem;
    text-align: center;
    margin-bottom: 20px;
    font-weight: bold;
}

.co_box01 .sub_ttl3{
    margin-bottom: 40px;
}

.co_box01 .attention span{
    font-size: 3rem;
    letter-spacing: 3px;
}

.co_box02{
    margin: 50px auto 0;
}

.co_tel_btn a{
    font-size: 2.4rem;
    display: inline-block;
    padding: 8px 35px 3px;
    text-align: center;
    background-color: #289eed;
    color: #fff;
    border: 2px solid #289eed;
    border-radius: 500px;
    font-weight: 600;
    letter-spacing: 2px;
}

.co_tel_btn a:hover{
    color: #289eed;
    background-color: #fff;
}

.co_tel_btn i{
    margin-right: 20px;
}

section.form_box{
    padding: 100px 0;
}

.form_box{
	background: #f5f5f5;
}

.mailform{
	width: 98%;
	text-align: center;
}

.mailform table{
	width: 100%;
}

.mailform th{
	font-size: 1.8rem;
	text-align: left;
	padding-left: 2%;
	border-bottom: dotted 1px #b0b0b0;
	font-weight: 400;
	display: table-cell;
	vertical-align: middle;
}

.mailform td{
	font-size: 1.8rem;
	width: 70%;
	padding: 2% 1%;
	border-bottom: dotted 1px #b0b0b0;
	text-align: left;
}

input[type="checkbox"]{
	font-size: 1.8rem;
	width: 20px;
	height: 20px;
	border: solid 1px #bababa;
	background-color: #fff;
	display: table-cell;
	margin-bottom: 5px;
}

input[type="text"]{
	height: 40px;
	font-size: 1.8rem;
	padding: 10px;
	background: #fff;
	border: solid 1px #bababa;
    width: 100% !important;
}

input[type="email"]{
	height: 40px;
	font-size: 1.8rem;
	padding: 10px;
	background: #fff;
	border: solid 1px #bababa;
}

textarea[type="text"]{
	padding: 10px;
	font-size: 1.8rem;
	background: #fff;
	border: solid 1px #bababa;
    width: 100% !important;
}

.contact_table th span,.form_attention span{
	color: #fff;
	background-color: rgb(38, 158, 237);
	padding: 2px 6px;
	margin-right: 10px;
	font-size: 1.4rem;
}

.contact_table th span.nini{
    background-color: rgb(38, 158, 237,0);
    color: #333;
    padding: 2px 3px;
}

input{
	appearance: auto;
}

.mailform .contact_table .ib div{
	display: inline-block;
}

.mailform .contact_table .ib div+div{
	margin-left: 20px;
}

.form_box h2{
	margin-bottom: 50px;
	background-color: #fff;
	margin-top: 70px;
}

.form_box .form_ttl{
	text-align: center;
	font-size: 2rem;
	font-weight: bold;
}

.form_attention{
	font-size: 1.6rem;
	margin-top: 40px;
	width: fit-content;
	margin: 40px auto 0;
	text-align: left;
}

.form_accordion{
	text-align: left;
	margin-top: 40px;
}

.form_attention p+p{
	margin-top: 10px;
}

input[type="checkbox"] + label{
	cursor: pointer;
}

.Label{
	font-size: 2rem;
	letter-spacing: 2px;
	padding: 1% 1%;
	display: block;
	border-bottom: solid 3px #269eed;
	color: #269eed;
	font-weight: bold;
	background-color: #fff;
	text-align: center;
}

.Label::before{
	content: "";
	width: 12px;
	height: 12px;
	border-top: 2.5px solid #269eed;
	border-right: 2.5px solid #269eed;
	position: absolute;
	-webkit-transform: rotate(45deg);
	transform: rotate(135deg);
	text-decoration: transparent;
	top: calc(50% - 6px);
	right: 20px;
	margin-bottom: 1em;
}

.Label, .co_open{
	backface-visibility: hidden;
	transform: translateZ(0);
	transition: all 0.5s;
}

input[type="checkbox"].toggle{
	display: none;
}

.toggle:checked + .Label::before{
	transform: rotate(-45deg);
	text-decoration: transparent;
}

.toggle:checked + .Label + .co_open{
	height: auto;
	transition: all .5s;
}

.form_accordion p{
	font-size: 1.6rem;
	text-align: left;
	letter-spacing: 2px;
	padding: 1% 0;
	padding-left: 1%;
	line-height: 200%;
}

.form_accordion h3{
	margin-top: 30px;
	font-size: 1.8rem;
	position: relative;
	padding-left: 26px;
	padding-bottom: 5px;
	border-bottom: dashed 1px #333;
}

.form_accordion h3::before{
	content: "";
	position: absolute;
	display: inline-block;
	width: 18px;
	height: 18px;
	background: url(../img/check.png);
	background-size: cover;
	background-position: center;
	top:9px;
	left: 0;
}

.co_open{
	height: 0;
	margin-bottom: 10px;
	overflow: hidden;
}

button[type="submit"]{
	font-size: 1.8rem;
	padding: 10px;
}

.form_btn button{
	cursor: pointer;
	display: block;
	margin: 0 auto 5px;
	text-align: center;
	width: 250px;
	transition: all 0.5s;
	background: #269eed;
	color: #fff;
	border: solid 2px #269eed;
	border-radius: 50px;
	font-weight: 600;
	margin-top: 40px;
}

.form_btn button:hover{
	background-color: #fff;
	color: #269eed;
}

@media (max-width: 960px){
    .co{
        flex-direction: column;
    }
    .co .left{
        width: 100%;
    }
    .co .right{
        width: 100%;
        margin-top: 60px;
    }
    section.co_area{
        padding-bottom: 0;
    }
	.mailform .contact_table .ib div:first-child{
		margin-left: 20px;
	}

	.mailform .contact_table .ib div{
		display: block;
	}
	.form_ttl span{
		display: block;
	}
	.mailform table th{
		width: 100%;
		display: block;
		padding-top: 5px;
	}
	.mailform table td{
		width: 100%;
		display: block;
		border-bottom: dotted 1px #b0b0b0;
	}
	.mailform th{
		border-bottom: none;
	}
	.Label{
		font-size: 1.8rem;
		letter-spacing: normal;
	}
    .co_box01 .co_neko{
        width: 120px;
    }
    .co_box02 .co_neko{
        width: 170px;
        bottom: -40px;
    }
}

@media (max-width: 650px){
    .co_box02 .flex_ar{
        flex-direction: column;
        
    }

    .line_banner{
        margin-left: 0;
        margin: 0 auto;
    }

    .insta_banner{
        margin-right: 0;
        margin: 60px auto 0;
    }
    .co_box01 .attention{
        font-size: 2rem;
    }
    .co_box01 .attention span{
        font-size: 2.4rem;
    }
    .co_box01 .co_neko{
        bottom: -50px;
    }
}

/*thanksページ*/

.thanks_ttl{
	padding-left: 10px;
	text-align: center;
}

.thanks_ttl .ja{
	font-size: 3.4rem;
	display: block;
}

.thanks_ttl .en{
	font-size: 2rem;
	font-weight: bold;
	letter-spacing: 1.5px;
}

.thanks_txt p{
	text-align: center;
    line-height: 2.4;
}

.thanks_attention{
	font-size: 1.6rem;
	margin-top: 40px;
}

.sbtn{
    margin-top: 40px;
}

.sbtn a {
    font-size: 1.6rem;
    display: block;
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
    border: solid 2px #269eed;
    color: #333;
    letter-spacing: 2px;
    padding: 15px 0;
    text-align: center;
}

.sbtn a:hover{
    color: #fff;
    background-color: #269eed;
}