@charset "utf-8";

body {
  min-width: 1040px;
}
@media screen and (max-width:768px) {
	body {
	  min-width: initial;
	}
}
main img{
  max-width: 100%;
	height: auto;
}

/* page_name
-------------------------------------------------------------------*/
@import url("https://fonts.googleapis.com/css?family=Noto+Serif+JP&display=swap&subset=japanese");
.site_wrap{
	width: 100%;
	margin: 0 auto;
	height: 80px;
	left: 0;
}
.fadein {
  opacity : 0;
  transform : translate(0, 80px);
  transition : all 0.8s ease;
}
.hamburger{
	width: 100%;
	/* height: 60px; */
	position: absolute;
	z-index: 50;
	top: 0;
	left: 0;
	background-color: rgb(255 255 255);
	margin-top: 80px;
}




.h1 img{
	width: 100px;
	position: absolute;
	top: 50%;
    transform: translateY(-50%);
}
.green a{
	color: #7ba23f;
}
.hero{
	width: 100%;
	min-width: 1200px;
}
.flex{
	display: flex;
	flex-direction: row-reverse;
}
.img_wrap{
	width: 100%;
}
.align_items{
	align-items: flex-start;
}
.message_wrap{
	margin-right: 60px;
}
.style_32{
	font-size: 32px;
	font-weight: bold;
	letter-spacing: 0.1em;
}
.font_yu{
	font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif", "Noto Serif JP", serif;
}
.lh18{
	line-height: 1.8;
}
.foot_arrow li{
	position: relative;
	white-space: nowrap;
}
.foot_arrow li::before{
	content: "";
	position: absolute;
	display: inline-block;
	background-image: url("../image/top/arrow_right.gif");
	-webkit-background-size: 80%;
	background-size: 80%;
    background-repeat: no-repeat;
    width: 9px;
    height: 21px;
    top: 30%;
    left: -1%;
}
.down{
	    white-space: nowrap;
}
#foot_left small{
	font-size: 16px;
}
/*-------------------------------------------------------------------


                   レスポンシブ


-------------------------------------------------------------------*/
@media only screen and (min-device-width: 767px) and (max-device-width: 1024px) {
	body{
		width: 100%;
	}
}
@media screen and (max-width:768px) {
	#pan{
		overflow:hidden;
		overflow-x:auto;
		margin:10px 10px;
	   }
	   #pan ul{
		margin: 0 0 5px;
		font-size: 12px;
		white-space:nowrap;
	   }
	   #pan ul li{
		padding:0;
	   }
	   #pan ul li + li{
		padding-left:5px;
	   }
	   #pan ul li:before{
		margin-right:5px;
	   }
		  #pan::-webkit-scrollbar {
			  height:5px;
		  }
		  #pan::-webkit-scrollbar-track {
			  border-radius: 6px;
			  background:#ddd;
		  }
		  #pan::-webkit-scrollbar-thumb  {
			  background-color: #666;
			  border-radius: 6px;
		  }

	.header_top{
		display: none;
	}
	.site_wrap {
		height: auto;
	}
	.h1 img {
		left: 1%;
		margin-top: 22px;
	}
	.hero{
		max-width: 100%;
		min-width: 100%;
		margin-top: 0px;
	}
	.displaySp{
		padding: 6px;
	}

	.h_style01 {
		font-size: 42px;
		letter-spacing: 0;
	}
	.h_style01 span {
		padding: 0 0 0;
	}
	.hamburger {
		background-color: transparent;
		margin-top: 68px;
		background-color: rgba(4,4,4,0.6);
		height: 100vh;
	}
	.hamburger ul {
		width: 102%;
		margin-top: 0px;
	}
	header nav ul li:nth-child(1){
		margin-top: -23px;
	}
	header nav ul li/*:nth-child(2)*/::after{
		content: "";
		position: absolute;
		background-image: url("../image/news/arrow_right.gif");
		background-repeat: no-repeat;
		-webkit-background-size: 10px;
		background-size: 10px;
		width: 16px;
		height: 24px;
		top: 43%;
		right: 5%;
		z-index: 9990;
	}

	header nav ul li:nth-child(3), header nav ul li:nth-child(4) ,header nav ul li:nth-child(5),header nav ul li:nth-child(6){
		width: 100%;
	}

	.flex {
		display: block;
	}
	.sp_photo{
		width: 100%;
		text-align: center;
	}
	.sp_photo img{
		width: 80%;
		margin: 0 auto;
	}
	.message_wrap{
		margin: 0 15px 0;
	}
	.style02::after {
		left: 42%;
	}
	.style02_b::after {
		left: 42%;
	}
	.style_32 {
		letter-spacing: 0;
		margin-top: 20px;
		text-align: left;
	}
	.lh18{
		text-align: left;
	}
	.flexbox{
		width: 90%;
		display:-webkit-box;
		display: -webkit-flex;
		display:-ms-flexbox;
		display: flex;
		-webkit-flex-wrap:wrap;
		-ms-flex-wrap:wrap;
		flex-wrap:wrap;
		margin: 0 20px;
	}
	.up{
	  -webkit-box-ordinal-group:1;
	  -ms-flex-order:1;
	  -webkit-order:1;
	  order:1;
	}
	.down{
	  -webkit-box-ordinal-group:2;
	  -ms-flex-order:2;
	  -webkit-order:2;
	  order:2;
	}
	#foot_right li {
		display: block;
		text-align: left;
		margin-bottom: 10px;
	}
	#foot_right ul{
		margin: 22px 0 10px;
	}
	#foot_left {
		margin: 0 0 30px;
	}
	td{
		display: block;
		width: 95%;
	}
}

/*kyu-common
-------------------------------------------------------------------*/
:root .bg-lgr{
	background: #f5ffe6; 
}
:root .bg-bro{
	background: #fbf9f3; 
}
:root main * {
	box-sizing:border-box;
}
:root main a{
	opacity: 1;
	text-decoration: none;
	color: unset;
}
@media screen and (max-width:768px) {
	:root [class$="-sec"]:has(:not(.sitewrap)),
	:root [class*="-sec "]:has(:not(.sitewrap)){
		padding-inline: 15px;
	}
}
:root main.kyu-page .mv-inner{
	margin: 72px 2.25% 40px;
	min-height: 288px;
	padding-inline: 2%;
	position: relative;
	border-radius: 1.25rem;
	overflow: hidden;
	background-image: url(../image/common/bg_page_mv.jpg);
	background-repeat: no-repeat;
	background-position-x: 80%;
	position: relative;
	z-index: 0;
}
:root main.kyu-page .mv-inner .page-ttl{
	font-size: 2.25rem;
	padding-inline: 2%;
	text-align: left;
	color: #fff;
	font-weight: 800;
	margin: auto;
	position: absolute;
	height: fit-content;
	z-index: 1;
	inset: 0;
	max-width: calc(1200px + 4%);
	text-shadow: 2px 2px 4px #9cc857;
}
:root main.kyu-page .bread{
	padding: 0.5em;
	background: #ffe113;
}
:root main.kyu-page .bread ul{
	text-align: left;
}
:root main.kyu-page .bread ul li{
	vertical-align:middle;
	padding: 0 0 0 10px;
	display:inline-block;
	font-size: 0.875rem;
	font-weight: 500;
	white-space: nowrap;
}
:root main.kyu-page .bread ul li:not(:first-child):before{
	content: "＞";
	font-weight: 600;
	display:inline-block;
	margin-right:0.5em;
}
:root main.kyu-page .bread ul li a{
	border-bottom: 1px solid;
}
:root main.kyu-page .bread ul li a:hover{
	border-bottom: none;
}
:root main.kyu-page .page-sec{
	padding-block: 4em;
	position: relative;
	z-index: 0;
}
:root main.kyu-page .page-h2{
	padding-block: 1em 1em;
	margin-bottom: 2em;
	font-size: 2rem;
	text-align: center;
	font-weight: 600;
	background: url(../image/common/bg_h2.png) no-repeat bottom center;
	background-size: 142px;
}
:root main.kyu-page .page-h3{
	font-size: 1.75rem;
	font-weight: 600;
	padding-left: 0.5em;
	margin-bottom: 1em;
	border-left: 4px solid #9cc857;
}
:root main.kyu-page .page-h4{
	font-size: 1.25rem;
	font-weight: 600;
	color: #7ba23f;
	font-feature-settings: 'palt';
	margin-bottom: 1em;
	word-break: auto-phrase;
}
@media screen and (max-width:768px) {
	:root main.kyu-page .mv-inner{
		margin: 0 0 20px;
		min-height: 180px;
		padding-inline: 15px;
		border-radius: 1rem;
		background-position-x: 82%;
		background-size: cover;
	}
	:root main.kyu-page .mv-inner .page-ttl{
		font-size: 1.65rem;
	}
	:root main.kyu-page .bread ul li{
		font-size: 0.75rem;
	}
	:root main.kyu-page .page-sec{
		padding-block: 2em;
	}
	:root main.kyu-page .page-h2{
		padding-block: 0.5em 1em;
		margin-bottom: 1.5em;
		font-size: 1.5rem;
	}
	:root main.kyu-page .page-h3{
		font-size: 1.35rem;
		border-left: 3px solid #9cc857;
	}
}

/*kyu-top
-------------------------------------------------------------------*/
.kyu-top .mv-sec{
	background: linear-gradient(to bottom, transparent 30%, #9cc857 30%);
	padding-block: 72px 8em;
	padding-inline: 2.25%;
	position: relative;
	z-index: 0;
}
.kyu-top .mv-sec .bg-area{
	border-radius: 1.25rem;
	background: #fbf9f3;
	overflow: hidden;
	position: relative;
	aspect-ratio: 1840 / 630;
	background-image: url(../image/top/bg_mv.jpg);
	background-position-y: bottom;
}
.kyu-top .mv-sec .bg-area .img-ttl{
	inset: 0;
	padding-bottom: 4em;
	padding-right: 14%;
	width: 68%;
}
.kyu-top .mv-sec .mv-img{
	position: absolute;
	z-index: 0;
	margin:auto;
	width: fit-content;
	height: fit-content;
}
.kyu-top .mv-sec .img01{
	inset: auto auto 2em 72%;
	width: 21%;
}
.kyu-top .mv-sec .img02{
	inset: auto auto 52.25% 14.5%;
	width: 8%;
}
.kyu-top .mv-sec .img03{
	inset: auto auto 57% 43%;
	width: 7.5%;
}
.kyu-top .mv-sec .img04{
	inset: auto auto 26% 5%;
	width: 5%;
}
.kyu-top .mv-sec .img05{
	inset: auto auto 6% 51%;
	width: 6.5%;
}
.kyu-top .mv-sec .mv-img {
    transform-origin: center bottom;
    transform: translateY(-50px) scale(0.6);
    opacity: 0;
}
.kyu-top .mv-sec .mv-img.img01.once {
    animation: bounceInOnly 0.45s cubic-bezier(0.22, 1, 0.36, 1) 0.5s forwards;
}

@keyframes bounceInOnly {
    0% {
        opacity: 0;
        transform: translateY(-40px) scale(0.5);
    }
    50% {
        opacity: 1;
        transform: translateY(8px) scale(1.1, 0.9);
    }
    75% {
        transform: translateY(-4px) scale(0.97, 1.03);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}
.kyu-top .mv-sec .mv-img.img02.once {
    animation: bounceStandard 0.4s cubic-bezier(0.22, 1, 0.36, 1) 0.8s forwards;
}

@keyframes bounceStandard {
    0% {
        opacity: 0;
        transform: translateY(-50px) scale(0.6);
    }
    45% {
        opacity: 1;
        transform: translateY(10px) scale(1.15, 0.85);
    }
    65% {
        transform: translateY(-5px) scale(0.95, 1.05);
    }
    82% {
        transform: translateY(2px) scale(1.02, 0.98);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.kyu-top .mv-sec .mv-img.img03.once {
    animation: bounceSquish 0.45s cubic-bezier(0.22, 1, 0.36, 1) 1.1s forwards;
}

@keyframes bounceSquish {
    0% {
        opacity: 0;
        transform: translateY(-60px) scale(0.5, 1.2);
    }
    50% {
        opacity: 1;
        transform: translateY(12px) scale(1.3, 0.7);
    }
    70% {
        transform: translateY(-6px) scale(0.9, 1.1);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.kyu-top .mv-sec .mv-img.img04.once {
    animation: bounceRotate 0.5s cubic-bezier(0.22, 1, 0.36, 1) 1.4s forwards;
}

@keyframes bounceRotate {
    0% {
        opacity: 0;
        transform: translateY(-50px) rotate(-12deg) scale(0.6);
    }
    50% {
        opacity: 1;
        transform: translateY(8px) rotate(6deg) scale(1.1, 0.9);
    }
    75% {
        transform: translateY(-3px) rotate(-2deg) scale(0.98, 1.02);
    }
    100% {
        opacity: 1;
        transform: translateY(0) rotate(0deg) scale(1);
    }
}

.kyu-top .mv-sec .mv-img.img05.once {
    animation: bounceDrop 0.55s cubic-bezier(0.22, 1, 0.36, 1) 1.7s forwards;
}

@keyframes bounceDrop {
    0% {
        opacity: 0;
        transform: translateY(-80px) scale(0.4);
    }
    40% {
        opacity: 1;
        transform: translateY(15px) scale(1.2, 0.8);
    }
    60% {
        transform: translateY(-10px) scale(0.9, 1.1);
    }
    80% {
        transform: translateY(4px) scale(1.05, 0.95);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}
@media screen and (max-width:768px) {
	.kyu-top .mv-sec{
		padding-block: 1em 4em;
		padding-inline: 15px;
		overflow: hidden;
	}
	.kyu-top .mv-sec .bg-area{
		border-radius: 1rem;
		aspect-ratio: 1 / 1;
		background-image: url(../image/top/bg_mv.jpg);
		background-size: cover;
	}
	.kyu-top .mv-sec .bg-area .img-ttl{
		padding-bottom: 6em;
		padding-right: 0%;
		width: 88%;
	}
	.kyu-top .mv-sec .img01{
		inset: auto 2% 1em auto;
		width: 36%;
	}
	.kyu-top .mv-sec .img02{
		inset: auto auto 61.25% 0%;
		width: 15%;
	}
	.kyu-top .mv-sec .img03{
		inset: auto auto 70% 49%;
		width: 15.5%;
	}
	.kyu-top .mv-sec .img04{
		inset: auto auto 27% 4%;
		width: 12%;
	}
	.kyu-top .mv-sec .img05{
		inset: auto auto 28% 45%;
		width: 14.5%;
	}
}


.kyu-top .menu-sec{
	background: linear-gradient(to bottom, #9cc857 20%, #fbf9f3 20%);
	padding-inline: 2%;
}
.kyu-top .menu-inner{
	background: #fbf9f3;
	border-radius: 1.5em;
	padding: 6em 2%;
}
.kyu-top .menu-sec .menu-ul{
	max-width: 1522px;
	margin-inline: auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 2em 2.5%;
}
.kyu-top .menu-sec .menu-ul .menu-li{
	width: calc(95% / 3);
}
.kyu-top .menu-sec .menu-ul .menu-li:nth-child(1),
.kyu-top .menu-sec .menu-ul .menu-li:nth-child(2){
	width: calc(97.5% / 2);
	/* background: #f5ffe6; */
}
.kyu-top .menu-sec .menu-ul .menu-li a{
	display: block;
	border-radius: 0.65em;
	overflow: hidden;
	background: #fff;
	border: 2px solid ;
}
.kyu-top .menu-sec .menu-ul .menu-li:nth-child(1) a,
.kyu-top .menu-sec .menu-ul .menu-li:nth-child(2) a{
	background: #f5ffe6;
	display: flex;
}
.kyu-top .menu-sec .menu-ul .menu-li .img{
	margin-bottom: 1.5em;
}
.kyu-top .menu-sec .menu-ul .menu-li:nth-child(1) a .img,
.kyu-top .menu-sec .menu-ul .menu-li:nth-child(2) a .img{
	width: 40%;
	margin-bottom: 0;
}
.kyu-top .menu-sec .menu-ul .menu-li:nth-child(1) a  .img img,
.kyu-top .menu-sec .menu-ul .menu-li:nth-child(2) a  .img img{
	height: 100%;
	object-fit: cover;
	object-position: center;
}
.kyu-top .menu-sec .menu-ul .menu-li:nth-child(1) a .txt_area,
.kyu-top .menu-sec .menu-ul .menu-li:nth-child(2) a .txt_area{
	padding: 4em 1em 2em;
	display: flex;
	flex-direction: column;
	width: 60%;
}
.kyu-top .menu-sec .menu-ul .menu-li .li-lead{
	font-size: 1.75rem;
	font-weight: 800;
	margin-bottom: 1em;
}
.kyu-top .menu-sec .menu-ul .menu-li .link_btn{
	margin-bottom: 2em;
	margin-inline: auto;
	padding-inline: 1em;
	max-width: 305px;
	width: 100%;
}
@media screen and (max-width:1400px) {
	.kyu-top .menu-sec .menu-ul .menu-li .li-lead{
		font-size: 1.5rem;
	}
}


@media screen and (max-width:768px) {
	.kyu-top .menu-sec{
		padding-inline: 0 !important;
	}
	.kyu-top .menu-inner{
		padding: 2em 15px;
	}
	.kyu-top .menu-sec .menu-ul{
		gap: 1em 3%;
	}
	.kyu-top .menu-sec .menu-ul .menu-li{
		width: 100% !important;

	}
	.kyu-top .menu-sec .menu-ul .menu-li a{
		border: 1px solid ;
		display:flex;
	}
	.kyu-top .menu-sec .menu-ul .menu-li .img{
		margin-bottom: 0em;
		width: 40%;
	}
	.kyu-top .menu-sec .menu-ul .menu-li .img img{
		aspect-ratio: 1;
		object-fit: cover;
		height: 100%;
	}
	.kyu-top .menu-sec .menu-ul .menu-li .txt_area{
		width: 60%;
		padding: 0 !important;
	}
	.kyu-top .menu-sec .menu-ul .menu-li .li-lead{
		font-size: 1.125rem;
		margin-block: 1em 0.5em;
	}
	.kyu-top .menu-sec .menu-ul .menu-li .link_btn{
		margin-bottom: 1em;
	}
	.kyu-top .menu-sec .menu-ul .menu-li .link_btn span{
		padding: 0.5em;
	}
}
.kyu-top .qa-sec{
	padding-block: 8em 7em;
	overflow: hidden;
}
.kyu-top .qa-sec .sitewrap{
	overflow: visible;
}
.kyu-top .qa-sec .qa-bnr{
	max-width: 864px;
	margin-inline: auto;
	padding: 4em 2em;
	text-align: center;
	background: #ffe113;
	border: 2px solid;
	position: relative;
	z-index: 0;
	border-radius: 1em;
}
.kyu-top .qa-sec .qa-bnr .qa-ttl{
	font-size: 2.25rem;
	font-weight: 800;
	margin-bottom: 1em;
}
.kyu-top .qa-sec .qa-bnr .img{
	position: absolute;
	z-index: 1;
	margin: auto;
}
.kyu-top .qa-sec .qa-bnr .img.img01{
	inset: -4em auto auto -2em; 
}
.kyu-top .qa-sec .qa-bnr .img.img02{
	inset: -1em auto auto calc(50% + 10em);
}
.kyu-top .qa-sec .qa-bnr .img.img03{
	width: 25%;
	inset: auto -6em -3.25em auto;
}
.kyu-top .qa-sec .qa-bnr .img.img04{
	width: 17%;
	inset: auto -5em 12em auto;
}
@media screen and (max-width:768px) {
	.kyu-top .qa-sec{
		padding-block: 4em 6em;
	}
	.kyu-top .qa-sec .qa-bnr{
		padding: 2.5em 2em 2em;
	}
	.kyu-top .qa-sec .qa-bnr .qa-ttl{
		font-size: 1.75rem;
	}
	.kyu-top .qa-sec .qa-bnr .img.img01{
		inset: -2em auto auto -0.5em; 
		width: 46%;
	}
	.kyu-top .qa-sec .qa-bnr .img.img02{
		inset: -1.25em -0.5em auto auto;
		width: 24%;
	}
	.kyu-top .qa-sec .qa-bnr .img.img03{
		width: 20%;
		inset: auto 0em -6em auto;
	}
	.kyu-top .qa-sec .qa-bnr .img.img04{
		width: 20%;
		inset: auto -0.5em -1em auto;
	}
}
.kyu-top .other-sec{
	position: relative;
	z-index: 0;
	padding-block: 4em;
}
.kyu-top .other-sec .other-ul{
	display: flex;
	gap: 4%;
	padding-block: 2em;
}
.kyu-top .other-sec .other-ul .other-li{
	width: 48%;
	background: #9cc857;
	border: 2px solid;
	border-radius: 0.65em;
	padding: 3em 1em 3em;
	text-align: center;
}
.kyu-top .other-sec .other-ul .other-li .img{
	margin-bottom: 1em;
}
.kyu-top .other-sec .other-ul .other-li .other-ttl{
	font-size: 2.125rem;
	font-weight: 800;
	margin-bottom: 1.25em;
}
.kyu-top .other-sec .last-img{
	position: absolute;
	z-index: 1;
	margin: auto;
	inset: auto auto -1.85em 6%;
}
@media screen and (max-width:1800px){
	.kyu-top .other-sec{
		position: relative;
		z-index: 0;
		padding-block: 6em 10em;
	}
	.kyu-top .other-sec .last-img{
		width: 9em;
		inset: auto auto -1.5em 4%; 
	}
}
@media screen and (max-width:768px){
	.kyu-top .other-sec{
		padding-block: 1em 4em;
	}
	.kyu-top .other-sec .other-ul{
		gap: 1em;
		flex-direction: column;
		align-items: center;
	}
	.kyu-top .other-sec .other-ul .other-li{
		width: 90%;
		padding: 1em 3.5em 1em;
	}
	.kyu-top .other-sec .other-ul .other-li .img{
		width: 60px;
		margin-inline: auto;
	}
	.kyu-top .other-sec .other-ul .other-li .other-ttl{
		font-size: 1.35rem;
		margin-bottom: 1em;
	}
	.kyu-top .other-sec .last-img{
		width: 5.5em;
		inset: auto auto -0.95em 4%;
	}
}





/*character
-------------------------------------------------------------------*/
.chara-page .chara01-sec .img01{
	text-align: center;
	margin-bottom: 4em;	
}
.chara-page .chara01-sec .img01 img{
	margin-bottom: 1em;
    transform: translateY(12.5%);
}
.chara-page .chara01-sec .img01 .img01-txt{
	font-size: 1.5rem;
	font-weight: 600;
}
.chara-page .chara01-sec .detail-area{
	border-radius: 1rem;
	background: #fff;
	max-width: 800px;
	margin: 0 auto 2em;
	display: flex;
	align-items: center;
	gap: 4%;
	border: 2px solid;
	padding: 2em ;
}
.chara-page .chara01-sec .detail-area .img-area{
	width: 44%;
	text-align: center;
}
.chara-page .chara01-sec .detail-area .txt-area{
	width: 52%;
}
.chara-page .chara01-sec .detail-area .txt-area ul li{
	margin-bottom: 1.25em;
}
.chara-page .chara02-sec .chara-col{
	display: flex;
	justify-content: center;
	gap: 3em;
	align-items: center;
	margin-bottom: 2em;
}
.chara-page .chara02-sec .chara-col .txt-area .txt{
	line-height: 2;
	text-align: center;
	font-weight: 600;
}
.chara-page .chara02-sec .chara-col .txt-area .txt span{
	font-size: 1.5rem;
}
.chara-page .chara02-sec .chara-bnr{
	text-align: center;
	margin-bottom: 4em; 
}
.chara-page .chara02-sec .chara-bnr a:hover{
	opacity: 0.7;
	transition: opacity 0.3s; 
}
.chara-page .chara02-sec .chara-col02{
	display: flex;
	justify-content: center;
	gap: 1em 2%;
	flex-wrap: wrap;
	margin-bottom: 4em;
}
.chara-page .chara02-sec .chara-col02 li{
	width: calc(96% / 3);
	border-radius: 0.65rem;
	background: #fbf9f3;
	border: 2px solid;
	padding: 1em 2em 2em;
	text-align: center;
}
.chara-page .chara02-sec .chara-col02 li .txt{
	font-size: 1.125rem;
	font-weight: 600;
	margin-bottom: 1em;
}
.chara-page .chara02-sec .chara-col02 li .subtxt{
	font-size: 0.875rem;
	font-weight: 600;
}
@media screen and (max-width:768px) {
	.chara-page .chara01-sec .img01{
		margin-bottom: 2em;	
	}
	.chara-page .chara01-sec .img01 img{
		max-width: 120px;
	}
	.chara-page .chara01-sec .img01 .img01-txt{
		font-size: 1.125rem;
	}
	.chara-page .chara01-sec .detail-area{
		border-radius: 0.75rem;
		padding: 1.5em 1em 1em;
	}
	.chara-page .chara01-sec .detail-area .img-area{
		width: 40%;
	}
	.chara-page .chara01-sec .detail-area .img-area img{
		max-width: 60%;	
		text-align: center;
	}
	.chara-page .chara01-sec .detail-area .txt-area{
		width: 56%;
	}
	.chara-page .chara01-sec .detail-area .txt-area ul li{
		margin-bottom: 0.5em;
		font-size: 0.875rem;
	}
	.chara-page .chara02-sec .chara-col{
		gap: 2%;
	}
	.chara-page .chara02-sec .chara-col img{
		width: 80%;
	}
	.chara-page .chara02-sec .chara-col .txt-area .txt span{
		font-size: 1.25rem;
	}
	.chara-page .chara02-sec .chara-bnr{
		text-align: center;
		margin-bottom: 3em; 
	}
	.chara-page .chara02-sec .chara-col02{
		gap: 0.875em 4%;
		margin-bottom: 2em;
	}
	.chara-page .chara02-sec .chara-col02 li{
		width: calc(96% / 2);
		padding: 1em 0.5em 2em;
	}
	.chara-page .chara02-sec .chara-col02 li img{
		width: 70%;
	}
	.chara-page .chara02-sec .chara-col02 li .txt{
		font-size: 1rem;
		margin-bottom: 0.5em;
	}
	.chara-page .chara02-sec .chara-col02 li .subtxt{
		font-size: 0.75rem;
	}
}

/*point
-------------------------------------------------------------------*/
.point-page .point01-sec{
	position: relative;
	z-index: 0;
}
.point-page .point01-sec .first-img{
	position: absolute;
	z-index: 1;
	margin: auto;
	inset: 6em auto auto calc(50% + 410px);
}
.point-page .point-area{
	border-radius: 1rem;
	background: #fff;
	margin-bottom: 4em;
	border: 2px solid;
	padding: 3em;
}
.point-page .point-area .col-area{
	display: flex;
	gap: 1em 5%;
	flex-direction: row-reverse;
	margin-bottom: 3em;
}
.point-page .point-area .col-area + .col-area{
	padding-top: 3em;
	border-top: 1px solid #c9c9c9;
} 
.point-page .point-area .col-area.rev{
	flex-direction: row;
}
.point-page .point-area .col-area .txt-area{
	width: 50%;
}
.point-page .point-area .col-area .txt-area .txt{
	line-height: 2;
	font-weight: 500;
}
.point-page .point-area .col-area .img-area{
	width: 45%;
}
.point-page .point-area .col-area .img-area img{
	border-radius: 0.65rem;
}
.point-page .point-area .col-area.col-area02{
	border-top: none;
	padding-top: 0;
	gap: 6%;
	flex-direction: row;
}
.point-page .point-area .col-area.col-area02 .col-item{
	width: 47%;
	display: flex;
	gap: 1em 4%;
}
.point-page .point-area .col-area.col-area02 .col-item .col-img{
	width: 50%;
}
.point-page .point-area .col-area.col-area02 .col-item .col-txt{
	width: 46%;
	font-weight: 500;
}
.point-page .point-area .col-area.col-area02 .col-item img{
	border-radius: 0.65rem;
}
.point-page .point-area .att-area{
	background: #fbf9f3;
	border-radius: 0.65em;
	padding: 1.5em 2em;
	font-weight: 500;
}
.point-page .point01-sec .last-img{
	position: absolute;
	z-index: 1;
	margin: auto;
	inset: auto auto -0.5em calc(50% - 710px);
}

@media screen and (max-width:1600px){
	.point-page .point01-sec .last-img{
		width: 7em;
		inset: auto auto -0em 4%;
	}
}
@media screen and (max-width:768px) {
	.point-page .point01-sec{
		padding-bottom: 5em !important;
	}
	.point-page .point01-sec .first-img{
		width: 5em;
		inset: 10em 0 auto auto;
	}
	.point-page .point-area{
		border-radius: 0.75rem;
		margin-bottom: 2em;
		padding: 1.5em 1em 1em;
	}
	.point-page .point-area .col-area{
		flex-direction: column !important;
		margin-bottom: 2em;
	}
	.point-page .point-area .col-area + .col-area{
		padding-top: 2em;
	} 
	.point-page .point-area .col-area .txt-area{
		width: 100%;
	}
	.point-page .point-area .col-area .txt-area .txt{
		line-height: 1.6;
		font-size: 0.875rem;
	}
	.point-page .point-area .col-area .img-area{
		width: 100%;
	}
	.point-page .point-area .col-area.col-area02{
		padding-top: 0;
		gap: 2em;
		flex-direction: row;
	}
	.point-page .point-area .col-area.col-area02 .col-item{
		width: 100%;
	}
	.point-page .point-area .col-area.col-area02 .col-item .col-img{
		width: 40%;
	}
	.point-page .point-area .col-area.col-area02 .col-item .col-txt{
		width: 56%;
		font-size: 0.875rem;	
	}
	.point-page .point-area .att-area{
		padding: 1.5em 1em;
		font-size: 0.75rem;
	}
	.point-page .point01-sec .last-img{
		width: 5em;
		inset: auto auto -0.5em 4%;
	}
}
/*about
-------------------------------------------------------------------*/
.about-page .about01-sec .item-area {
	position: relative;
	z-index: 0;
}
.about-page .about01-sec .item-area .first-img{
	position: absolute;
	z-index: 0;
	margin: auto;
	width: fit-content;
	inset: auto auto -6em 0;
}

.about-page .about01-sec .sec-img{
	position: absolute;
	z-index: 0;
	margin: auto;
	width: fit-content;
	inset: auto auto -2em calc(50% - 800px);
}
.about-page .about01-sec .item-area .txt{
	text-align: center;
	line-height: 2.2;
	margin-block: 3em 4em;
	font-weight: 500;
}
.about-page .about01-sec .item-area .img{
	margin: 0 auto 6em;
	max-width: 1000px;
}
.about-page .about01-sec .item-area .img img{
	border: 2px solid;
	border-radius: 1.5rem;
	aspect-ratio: 2 / 1.1;
	object-fit: cover;
}
.about-page .about01-sec .reason-area .col-area{
	border-radius: 1rem;
	background: #fff;
	margin: 0 auto 3em;
	display: flex;
	gap: 1em 4%;
	border: 2px solid;
	padding: 3em;
}
.about-page .about01-sec .reason-area .col-area .txt-area{
	width: 50%;
}
.about-page .about01-sec .reason-area .col-area .txt-area .tag{
	background: #9cc857;
	width: fit-content;
	margin-bottom: 1.4em;
	font-size: 1.25rem;
	font-weight: 600;
	color: #fff;
	padding: 0.25em 1em;
	border-radius: 2em;
}
.about-page .about01-sec .reason-area .col-area .txt-area .txt{
	font-weight: 500;
	line-height: 2;
}
.about-page .about01-sec .reason-area .col-area .img-area{
	width: 46%;
}
.about-page .about01-sec .reason-area .col-area .img-area img{
	border-radius: 0.65rem;
}
.about-page .about02-sec{
	position: relative;
	z-index: 0;
	overflow: hidden;
}
.about-page .about02-sec .last-img{
	position: absolute;
	z-index: 1;
	inset: auto 0 0 calc(50% + 380px);
}
.about-page .about02-sec .series-ul{
	display: flex;
	flex-wrap: wrap;
	gap: 1.5em 1.5%;
	margin-bottom: 4em;
}
.about-page .about02-sec .series-ul li{
	width: calc(95.5% / 4);
}
.about-page .about02-sec .series-ul li a{
	display: block;
	height: 100%;
	border-radius: 0.65rem;
	border: 2px solid #eaeaea;
	text-align: center;
	padding: 2em;
	transition: all 0.3s;	
}
.about-page .about02-sec .series-ul li a .img{
	margin-bottom: 1em;
}
.about-page .about02-sec .series-ul li a .series-ttl{
	font-size: 1.125rem;
	font-weight: 600;
	margin-bottom: 0.75em;
	min-height: 2lh;
}
.about-page .about02-sec .series-ul li a .link-txt{
	color: #3c75b6;
	font-size: 0.875rem;
	font-weight: 600;
}
.about-page .about02-sec .series-ul li a .link-txt span{
	border-bottom: 1px solid;
	transition: all 0.3s;
}
.about-page .about02-sec .series-ul li a .link-txt::before{
	content: "＞";
	font-weight: 600;
	display:inline-block;
	margin-right:0.5em;
}
@media (any-hover: hover) {
	.about-page .about02-sec .series-ul li a:hover{
		border: 2px solid #9cc857;
	}
	.about-page .about02-sec .series-ul li a:hover .link-txt span{
		border-bottom: transparent;
	}
}
@media screen and (max-width: 1600px) {
	:root main.about-page .page-sec.about01-sec{
		padding-bottom: 10em;
	}
	.about-page .about01-sec .sec-img{
		inset: auto auto -2em 2%;
		width: 10em;
	}
}

@media screen and (max-width:768px){
	.about-page .about01-sec .item-area .first-img{
		width: 5em;
		inset: auto auto -6em 0;
	}
	.about-page .about01-sec .item-area .txt{
		text-align: left;
		line-height: 1.8;
		margin-block: 0em 2em;
	}
	.about-page .about01-sec .item-area .img{
		margin: 0 auto 6em;
	}
	.about-page .about01-sec .item-area .img img{
		border: 1px solid;
		border-radius: .5rem;
	}
	.about-page .about01-sec .reason-area .col-area{
		border-radius: 0.65rem;
		margin: 0 auto 2em;
		padding: 1.5em 1em;
		flex-direction: column;
	}
	.about-page .about01-sec .reason-area .col-area .txt-area{
		width: 100%;
	}
	.about-page .about01-sec .reason-area .col-area .txt-area .tag{
		margin-bottom: 1em;
		font-size: 0.875rem;
	}
	.about-page .about01-sec .reason-area .col-area .txt-area .txt{
		font-size: 0.875rem;
		line-height: 1.6;
	}
	.about-page .about01-sec .reason-area .col-area .img-area{
		width: 100%;
	}	
	.about-page .about02-sec .last-img{
		width: 5em;
		inset: auto 4% 0em auto;
	}
	.about-page .about02-sec .series-ul{
		gap: 1em 4%;
		margin-bottom: 2em;
	}
	.about-page .about02-sec .series-ul li{
		width: calc(96% / 2);
	}
	.about-page .about02-sec .series-ul li a{
		padding: 1em 0;	
	}
	.about-page .about02-sec .series-ul li a .img{
		margin: 0 auto 1em;
		width: 70%;
	}
	.about-page .about02-sec .series-ul li a .series-ttl{
		font-size: 0.875rem;
		min-height: 2lh;
	}
	.about-page .about02-sec .series-ul li a .link-txt{
		font-size: 0.75rem;
	}
	:root main.about-page .page-sec.about01-sec{
		padding-bottom: 4em;
	}
	.about-page .about01-sec .sec-img{
		width: 5em;
	}
}




