@charset "utf-8";
/* CSS Document */



/*☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝

共通

☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝*/
.mv,.sec1{font-size: 24px;}
.sec{padding: 120px 5% 160px;}
h2{
	font-size: 50px;
	margin-bottom: 100px;
}
@media screen and (max-width: 1600px){
	.mv,.sec1{font-size: 18px;}
	h2{
		font-size: 42px;
		margin-bottom: 60px;
	}
}
@media screen and (max-width: 1300px){
	h2{
		font-size: 36px;
	}
	.sec{padding: 80px 5% 100px;}
}
@media screen and (max-width: 768px){
	.mv,.sec1{font-size: 16px;}
	h2{
		font-size: 25px;
		line-height: 1.8;
	}
	.sec{padding: 80px 5% 100px;}
}
@media screen and (max-width: 390px){
	h2{
		font-size: 23px;
		margin-bottom: 20px;
	}
	.mv,.sec1{font-size: 14px;}
}
@media screen and (max-width: 360px){
	h2{
		font-size: 20px;
	}
}
/*☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝

ｍｖ

☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝*/
.mv{
	background: url("../img/mv.jpg") center right;
	background-size: cover;
	margin: 0 auto 30px;
	background-repeat: no-repeat;
}
.mv>a{
	position: absolute;
	right: 10px;
	bottom: 10px;
	max-width: 160px;
	width: 15%;
}
.mv div{
	width: 41%;
	max-width: 770px;
	background: #fded52;
	display: flex;
	flex-direction: column;
    justify-content: center;
	padding: 10% 4% 10% 3%;
    box-sizing: border-box;
	height: 100vh;
}
.mv img{
	max-width: 465px;
	width: 93%;
	margin: 0 0 10%;
}
.mv p{
	margin: 0 0 15%;
	
}
.mv_btn{
	padding: 33px 20px;
	max-width: 400px;
}
@media screen and (max-width: 1300px){
	.mv .btn{
		padding: 23px 20px;
		min-width: 260px;
	}
	
}
@media screen and (max-width: 768px){
	.mv{
		background: url("../img/mv_sp.jpg") top center;
		margin: 0 auto 10px;
		padding-top: 100%;
		background-size: 100%;
		background-repeat: no-repeat;
	}
	.mv>a{display: none;}
	.mv div {
		width: 100%;
		background: url("../img/noice.jpg");
		padding: 40px 5%;
		box-sizing: border-box;
		height: auto;
		max-width: none;
	}
	.mv img{
		max-width: 320px;
		width: 80%;
		margin: 0 0 20px;
	}
	.mv p{
		margin: 0 0 40px;
	}
	.mv_btn{
		width: 100%;
	}
}
/*☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝

content

☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝*/
.sec2 h2,.sec3 h2,.sec4 h2{text-align: center;}
@media screen and (max-width: 768px){
}
/*☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝

sec1

☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝*/
.sec1 {
	background: url("../img/about.svg") no-repeat top 70px left -10px;
	
}
.copy{position: relative;}
.sec1 p{ margin-bottom: 140px; line-height: 2.25;}
.sec1 img{
	position: absolute;
    bottom: -50px;
    right: 0;
    width: 42%;
	max-width: 680px;
	z-index: -1;
} 
/*.movie{
	width: 100%;
	padding: 150px 15%;
	box-sizing: border-box;
	background: url("../img/movie_bg.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
	z-index: -2;
}

.youtube {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}*/
.movie{
	width: 100%;
	padding: 150px 15%;
	box-sizing: border-box;
	background: url("../img/movie_bg.jpg");
	background-repeat: no-repeat;
	background-size: cover;
}
.youtube {
  position: relative;
  width: 100%;
  padding-top: 56.25%; /* 縦横比16:9 (9 ÷ 16 = 56.25%) */
  
  overflow: hidden;
}
.youtube iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: none;
}
@media screen and (max-width: 1600px){
	.sec1 p {
	margin-bottom: 100px;}
}
@media screen and (max-width: 768px){
	.sec1 {
		background: url("../img/about_sp.svg") no-repeat top 60px left -10px;
		
	}
	.sec1 p{ margin-bottom: 40px;line-height: 1.8;}
	.movie{	padding: 75px 5%;}
}
/*☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝

sec2

☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝*/
.sec2 {
	background: url("../img/forte.svg") no-repeat top 70px right -10px;
}
.sec2 ul{
	display: flex;    
	flex-wrap: wrap;
    justify-content: space-between;
}
.sec2 li img{
	margin-bottom: 15px;
}
.sec2 li:nth-child(-n + 4){margin-bottom: 5%;}
.sec2 li:first-child{
	background: url("../img/forte_01.svg"),#e0ddd6;
	background-repeat: no-repeat;
	background-position: top 20px right 20px;
	background-size: 85px;
}
.sec2 li:nth-child(2){
	background: url("../img/forte_02.svg"),#e0ddd6;
	background-repeat: no-repeat;
	background-position: top 20px right 20px;
	background-size: 85px;
}
.sec2 li:nth-child(3){
	background: url("../img/forte_03.svg"),#e0ddd6;
	background-repeat: no-repeat;
	background-position: top 20px right 20px;
	background-size: 85px;
}
.sec2 li:nth-child(4){
	background: url("../img/forte_04.svg"),#e0ddd6;
	background-repeat: no-repeat;
	background-position: top 20px right 20px;
	background-size: 85px;
}
.sec2 li:nth-child(5){
	background: url("../img/forte_05.svg"),#e0ddd6;
	background-repeat: no-repeat;
	background-position: top 20px right 20px;
	background-size: 85px;
}
.sec2 li:nth-child(6){
	background: url("../img/forte_06.svg"),#e0ddd6;
	background-repeat: no-repeat;
	background-position: top 20px right 20px;
	background-size: 85px;
}
.sec2 li:nth-child(7){
	background: url("../img/forte_07.svg"),#e0ddd6;
	background-repeat: no-repeat;
	background-position: top 20px right 20px;
	background-size: 85px;
}
.sec2 li:last-child{
	background: url("../img/forte_08.svg"),#e0ddd6;
	background-repeat: no-repeat;
	background-position: top 20px right 20px;
	background-size: 85px;
}
.sec2 li{
	width: 21%;
	box-sizing: border-box;
	padding: 20px;
}
.sec2 em{
	font-size: 26px;
	text-align: center;
	height: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
	margin-bottom: 20px;
}
.sec2 li p{
	text-align: justify;
}

@media screen and (max-width: 1300px){
	.sec2 li{
		width: 30%;
	}
	.sec2 ul::after{
	  content:"";
	  display: block;
	  width:30%;
	}
	.sec2 li:nth-child(-n + 6){margin-bottom: 5%;}
}
@media screen and (max-width: 768px){
	.sec2 {
		background: url("../img/forte_sp.svg") no-repeat top 60px right -10px;
	}
	.sec2 li{width: 48%; padding: 5%;}
	.sec2 li:nth-child(-n + 6){margin-bottom: 4%;}
	.sec2 li:first-child,	.sec2 li:nth-child(2),	
	.sec2 li:nth-child(3),	.sec2 li:nth-child(4),	
	.sec2 li:nth-child(5),	.sec2 li:nth-child(6),	
	.sec2 li:nth-child(7),	.sec2 li:last-child{
		background: #e0ddd6 ;
	}
	.sec2 em{
		font-size: 16px;
		height: 38px;
		margin-bottom: 8%;
	}
	
}

@media screen and (max-width: 360px){
    .sec2 em {
        font-size: 14px;
	}
}
/*☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝

sec3

☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝*/
.sec3 {
	background: url("../img/suggest.svg") ,#fded52;
	background-repeat: no-repeat no-repeat;
	background-position: top 70px left -10px;
	padding: 120px 0 160px;
}


@media screen and (max-width: 1300px) {
    .sec3 {
        padding: 80px 0 100px;
    }
}
@media screen and (max-width: 768px) {
    .sec3 {
		background: url("../img/suggest_sp.svg") ,#fded52;
        padding: 75px 0 100px;
		background-repeat: no-repeat no-repeat;
		background-position:  top 60px left -10px;
	}
}

.sec3 p { text-align: center;color: #fff;}
.sec3 .btn{margin: 0 auto;}

/* .c-slider --------------------------------------------- */
.c-slider__wrapper {
    position: relative;
   margin: 0 auto 40px;
}
.splide{
	margin: 0 auto 100px;
}
.c-slider__img {
    transform: scale(.85);
	background-color: #006ab5;
	text-align: center;
	box-sizing: border-box;
	padding: 40px;
	position: relative;
	margin-bottom: 20px;
}
.splide__list .is-active .c-slider__img {transform: scale(1);
 }.c-slider__img div{
	width: 0;
    height: 0;
    border-style: solid;
    border-right: 30px solid transparent;
    border-left: 30px solid transparent;
    border-top: 20px solid #006ab5;
    border-bottom: 0;
    position: absolute;
    bottom: -19px;
    left: 50%;
    transform: translateX(-50%);
}
/* 画像 */
.c-slider__img img {
    width: 100%;
	max-width: 165px;
    height: auto;
    vertical-align: bottom;
	margin-bottom: 20px;
}
.splide__track .splide__list{
	   margin-bottom: 40px !important;
}


/* Prev & Nextボタン */
.splide__arrow {
    position: absolute;
    top: 50%;
    z-index: 1;
    transform: translate(0, -50%);
    display: grid;
    place-items: center;
    width: 70px;
    height: 70px;
    border: none;
    background-color: #222;
    box-sizing: border-box;
    touch-action: manipulation;
    cursor: pointer;
    overflow: hidden;
	border-radius: 50%;
}

.splide__arrow:focus-visible {
    outline: 3px solid #006ab5;
    outline-offset: 3px;
}

/* 前へボタン */
.splide__arrow--prev {
    left: 2%;
    transform: rotate(180deg) translate(0, 50%);
}

/* 次へボタン */
.splide__arrow--next {
    right: 2%;
}



/* 矢印 */
.splide__arrow::before {
    content: "";
    width: 20px;
    height: 20px;
    margin-left: -9px;
    border-top: 3px solid #fded52;
    border-right: 3px solid #fded52;
    box-sizing: border-box;
    transform: rotate(45deg);
}

/* ページネーション */
.splide__pagination {
    margin-top: 40px;
    gap: 20px; /* ドットの間隔 */
	margin-bottom: 100px;
}

.splide__pagination li {
    font-size: 0; /* inline-blockで生じる隙間を削除 */
}

/* ページネーションのドット */
.splide__pagination__page {
    background-color: #fff;
    border-radius: 50%;
    touch-action: manipulation;
    cursor: pointer;
	border:none;
	aspect-ratio: 1 / 1;
}

.splide__pagination__page.is-active {
    background-color: #006ab5;
}

.splide__pagination__page:focus-visible {
    outline: 3px solid #006ab5;
    outline-offset: 3px;
}

@media (hover: hover) and (pointer: fine) {
    .splide__pagination__page {
        transition: opacity 0.3s;
    }

    .splide__pagination__page:hover {
        opacity: 0.8;
    }
}


@media screen and (max-width: 768px) {
	.c-slider__wrapper {
	   margin: 0 auto 20px;
	}
	.splide {
		margin: 0 auto 60px;
	}
    .c-slider__img {
        transform: scale(.9);padding: 10%;
    }
    .is-ready .c-slider__img {
        transition: transform 0.5s;
    }
	.splide__track .splide__list {
		margin-bottom: 0px !important;
	}
	.splide__pagination__page {
		transform: scale(0.8);
	}
	.splide__arrow {
		width: 55px;
		height: 55px;
	}
	.splide__arrow::before {
		content: "";
		width: 15px;
		height: 15px;
		margin-left: -5px;
		border-top: 2px solid #fded52;
		border-right: 2px solid #fded52;
	}
}

/*☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝

sec4

☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝*/
.sec4 {
	background: url("../img/news.svg") no-repeat top 70px right -10px;
}
.sec4 ul{
	border-top: solid #222 2px;
	border-bottom: solid #222 2px;
	margin: 0 auto 80px;
}
.sec4 li:not(:last-child) {border-bottom: solid #222 2px;}
.sec4 li{padding: 30px;}
.sec4 li span{
	margin-bottom: 20px;
	display: block;
}
.sec4  .category1 span::after{
	content: "お知らせ";
	background: #fded52;
	font-size: 14px;
	padding: 5px 20px;
	margin-left: 30px;
}
.sec4  .category2 span::after{
	content: "メディア掲載";
	background: #fded52;
	font-size: 14px;
	padding: 5px 20px;
	margin-left: 30px;
}
.sec4 li a{
	display: inline;
	border-bottom: solid #222 1px;
}
.sec4 .btn{margin: 0 auto;}
@media screen and (max-width: 768px) {
.sec4 {
		background: url("../img/news_sp.svg") no-repeat top 60px right -10px;
	}
	.sec4  .category1 span::after{
		content: "お知らせ";
		background: #fded52;
		font-size: 14px;
		padding: 5px 20px;
		margin-left: 10px;
	}
	.sec4  .category2 span::after{
		content: "メディア掲載";
		background: #fded52;
		font-size: 14px;
		padding: 5px 20px;
		margin-left: 10px;
	}
	.sec4 li {
		padding: 5%;
	}
}
/*☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝

br

☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝☆～*＝＝*/
.br_470,.br_1420,.br_1155,.br_600{display: none;}
@media screen and (max-width: 1420px){
	.br_1420{display: block;}
	.br_1420_none{display: none;}
}
@media screen and (max-width: 1155px){
	.br_1155{display: block;}
	.br_1155_none{display: none;}
}
@media screen and (max-width: 768px){.br_1420,.br_1155{display: none;}}
@media screen and (max-width: 600px){.br_600{display: block;}}
@media screen and (max-width: 470px){.br_470{display: block;}}
