@charset "UTF-8";
article, aside, figcaption, figure, footer, header, img, nav, section {
display:block
}
body, dd, div, dl, dt, h1, h2, h3, h4, html, img, li, ol, p, span, table, td, th, tr, ul, figure {
margin: 0;
padding: 0;
border: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
vertical-align: baseline;
}
body {
font-size: 14px;
line-height: 2.2em;
font-family: "Noto Sans JP", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
font-weight: 400;
background-color: #FFFFFF;
color: #222222;
letter-spacing: 0.05em;
/*-webkit-text-size-adjust: 100%;*/
}
h1, h2 {
line-height: 1.8em;
}
h1, h2, h3, h4, h5 {
font-weight: 600;
}
@media screen and (max-width: 820px) {
body {
font-size: 13px;
line-height: 2.0em;
}
h1, h2 {
line-height: 1.5em;
color: #000000;
}
}

@media screen and (max-width: 767px) {
body {
font-size: 3.3vw;
line-height: 2.0em;
}
}
ol, ul {
list-style:none
}
table{
border-collapse: collapse;
border-spacing: 0;
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
-webkit-appearance: button;
cursor: pointer;
}
a {  }
a:link {
color: #222222;
text-decoration: none;
}
a:visited {
color: #222222;
text-decoration: none;
}
a:hover, a:active {
color: #222222;
text-decoration: none;
}
@media screen and (max-width: 767px) {
a:hover, a:active {
text-decoration: none;
}
}

/* ---------------------------------------------------------------- *
ドキュメント全体に関する設定
* ---------------------------------------------------------------- */
.contents {
overflow: hidden;
margin-right: 0;
margin-left: 0;
padding: 0;
clear: both;
position: relative;
z-index: 1;
background-color: #FFFFFF;
}
@media screen and (max-width: 767px) {
.contents {
	padding-top: 20px;
	border-bottom-width: 0px;
}
}

.Box01{
width: 100%;
margin-top: 0px;
margin-bottom: 0px;
clear: both;
padding-top: 50px;
padding-bottom: 50px;
}
@media screen and (max-width: 767px) {
.Box01{
padding-top: 7%;
padding-bottom: 7%;
}
}


/* ------ Column ------ */
.row110,.row110in{
max-width: 1100px;
margin: 0 auto;
padding: 0 3%;
}
.row120,.row120in{
max-width: 1200px;
margin: 0 auto;
padding: 0 3%;
}
.row130,.row130in{
max-width: 1300px;
margin: 0 auto;
padding: 0 3%;
}
.row150,.row150in{
max-width: 1500px;
margin: 0 auto;
padding: 0 3%;
}

.row,.row00{
max-width: 1000px;
margin: 0 auto;
padding: 0 3%;
}
.row:after,.row00:after {
content: "";
display: block;
clear: both;
}
.row02,.row02in {
max-width: 900px;
margin: 0 auto;
padding: 0 3%;
}
.row800,.row800in {
max-width: 800px;
margin: 0 auto;
padding: 0 3%;
}
.row700,.row700in {
max-width: 700px;
margin: 0 auto;
padding: 0 3%;
}
.row02:after {
content: "";
display: block;
clear: both;
}

@media screen and (max-width: 767px) {
/* 左右に余白を設定 */
.row110,.row120,.row130,.row150,.row,.row02,.row800,.row700  {
padding: 0 6%;
}
.row00,.row02in,.row800in,.row700in,.row110in,.row120in,.row130in,.row150in {
padding-top: 0;
padding-right: 0px;
padding-left: 0px;
padding-bottom: 0;
}
}

.pc_only {
display: block;
}
.sp_only {
display: none;
}
@media screen and (max-width: 767px) {
.pc_only {
display: none !important;
}
.sp_only {
display: block!important;
}
}
.pc_only820 {
display: block;
}
.sp_only820 {
display: none;
}
@media screen and (max-width: 820px) {
.pc_only820 {
display: none !important;
}
.sp_only820 {
display: block!important;
}
}

.imgpc {
width: auto;
height: auto;
display: block;
margin-left: auto;
margin-right: auto;
}
.imgfull img {
width: 100%;
height: auto;
display: block;
margin-left: auto;
margin-right: auto;
}
@media screen and (max-width: 767px) {
.imgpc {
width: 100%;
height: auto;
margin-left: auto;
margin-right: auto;
}
}


/*ホワイト*/
.wt .fa,.wt{
color: #FFF !important;
}
.wt a:link {
text-decoration: none !important;
color: #FFF !important;
}
.wt a:visited {
text-decoration: none !important;
color: #FFF !important;
}
.wt a:hover, .wt a:active {
text-decoration: none !important;
color: #FFF !important;
}

/*ブラック*/
.bk .fa,.bk{
color: #000000 !important;
}
.bk a:link {
text-decoration: none !important;
color: #000000 !important;
}
.bk a:visited {
text-decoration: none !important;
color: #000000 !important;
}
.bk a:hover, .bk a:active {
text-decoration: none !important;
color: #000000 !important;
}

/*コーポレートカラー*/
.corp .fa{
color: #ED6C00 !important;
}
.corp a:link {
text-decoration: none !important;
color: #ED6C00 !important;
}
.corp a:visited {
text-decoration: none !important;
color: #ED6C00 !important;
}
.corp a:hover, .corp a:active {
text-decoration: none !important;
color: #ED6C00 !important;
}

/*BGカラー*/
.bg_corp{
background-color: #ED6C00;
}
.bg_wt{
background-color: #FFFFFF;
}
.bg_bk{
background-color: #000000;
}


/* ---------------------------------------------------------------- *
ヘッダ部分の設定
* ---------------------------------------------------------------- */
.header_pc {
top: 0;
left: 0;
z-index: 10;
width: 100%;
transition: all 0.3s;
height: 80px;
background-color: #FFFFFF;
position: fixed;
box-shadow: 0 3px 10px rgba(0,0,0,0.2);
}
.header_pc h1.logo img {
height: 38px;
width: auto;
margin-top: 20px;
margin-left: 20px;
margin-right: 20px;
display: block;
position: relative;
z-index: 3;
transition: all 0.3s;
}
@media screen and (max-width: 820px) {
/*.header_pc {
height: 100px;
}
.header_pc h1.logo img {
height: 30px;
margin-top: 0px;
margin-left: 30px;
}*/
}
@media screen and (max-width: 767px) {
.header_pc {
height: 70px;
}
.header_pc h1.logo img{
height: 30px;
margin-left: 15px;
margin-top: 20px;
}
}
/*minimumヘッドナビ*/
.header_pc.minimum {
background-color: #222222;
}


.h_sns {
display: grid;
gap: 5px;
grid-template-columns: 1fr 1fr 1fr;
width: 170px;
margin-right: 0px;
margin-left: auto;
position: fixed;
top: 8px;
right: 100px;
z-index: 3;
}
.h_sns .item {
position: relative;
}
.h_sns .item a {
display: block;
cursor: pointer;
color: #FFFFFF;
}
.h_sns .item p {
text-align: center;
display: flex;
justify-content: center;
padding-top: 10px;
padding-bottom: 10px;
transition: all 0.3s;
}
.h_sns .item a :hover {

}

.h_sns .item p i img {
width: 100%;
height: auto;
display: block;
}
@media screen and (max-width: 820px) {
.h_sns .item p {
}
}
@media screen and (max-width: 767px) {
.h_sns {
width: 160px;
top: 18px;
right: 60px;
gap: 0px;
}
.h_sns .item p {
padding-top: 0px;
padding-bottom: 5px;
}
.h_sns .item p i img {
width: 38px;
}
.h_sns .item p i {
}
}




/* ---------------------------------------------------------------- *
バーガーナビ
* ---------------------------------------------------------------- */
#g-nav {
background-color: #FFFFFF;
}
@media screen and (max-width: 1600px) {
#g-nav {
background-size: contain;
}
}
@media screen and (max-width: 767px) {
#g-nav {
}
}
.nav-in {
display: grid;
gap: 40px;
grid-template-columns: 1fr;
/*position: absolute;*/
z-index: 999;
/*top: 50%;
left: 50%;
transform: translate(-50%,-50%);*/
opacity: 0;
max-width: 1100px;
margin-left: auto;
margin-right: auto;
margin-top: 100px;
padding: 0 3%;
margin-bottom: 50px;
}
#g-nav.panelactive .nav-in {
opacity:1;
}
@media screen and (max-width: 820px) {
.nav-in {
margin-top: 50px;
}
}
@media screen and (max-width: 767px) {
.nav-in {
gap: 0px;
grid-template-columns: 1fr;
padding: 0 0%;
/*position: static;
top: 0%;
left: 0%;
transform: translate(0%,0%);*/
width: 100%;
margin-top: 30px;
}
}


/*右カラム*/
@media screen and (max-width: 767px) {
.nav-in .item02 {
margin-left: 6%;
margin-right: 6%;
margin-bottom: 10%;
}
}


/* ---------------------------------------------------------------- *
swiper　設定
* ---------------------------------------------------------------- */
.t_mv{
_zoom: 1;
overflow: hidden;
position: relative;
margin: 0;
padding: 0;
}


.t_mv div.place {
position: absolute;
z-index: 10;
left: 50%;
top: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
color: #FFFFFF;
height: auto;
display: block;
width: 90%;
}

/*フルスクリーン表示　トップ*/
.swiper-container {
width: 100%;
height: 100vh;
}
@media screen and (max-width: 767px) {
.swiper-container {
/*height: 400px;*/
height: 100vh;
}
}

.swiper-slide {
background-position: center;
/*background-size: cover;*/
background-size:contain;
width:100%;
height:800px;
}

.swiper-slide {
position: relative;
background-size: cover;
height: auto;
}

/*画像切り替えPCSP*/
.mv01{
background-image: url(../parts/mv05.webp?v=20210116);
}
.mv02{
background-image: url(../parts/mv06.webp?v=20210116);
}
.mv03{
background-image: url(../parts/mv07.webp?v=20210116);
}
.mv04{
background-image: url(../parts/mv02.webp?v=20210116);
}
.mv05{
background-image: url(../parts/mv01.webp?v=20210116);
}
.mv06{
background-image: url(../parts/mv03.webp?v=20210116);
}
.mv07{
background-image: url(../parts/mv04.webp?v=20210116);
}



.t_mv div.place figure.logo {
margin-top: 20px;
}
.t_mv div.place figure.logo img {
height: auto;
width: 300px;
display: block;
text-align: center;
margin-left: auto;
margin-right: auto;
}
@media screen and (max-width: 896px) {
.t_mv div.place figure.logo img {
width: 50%;
}
}


.t_mv div.place .title {
font-size: 60px;
letter-spacing: 0em;
font-weight: 700;
text-align: center;
padding-bottom: 0px;
margin-bottom: 20px;
color: #FFFFFF;
display: block;
text-shadow: 0px 0px 15px rgba(0,0,0,0.3),
1px 0px 2px rgba(0,0,0,0.1), 
0px 1px 2px rgba(0,0,0,0.1), 
-1px 0px 2px rgba(0,0,0,0.1), 
0px -1px 2px rgba(0,0,0,0.1);
line-height: 1.3em;
}
.t_mv div.place .subtitle {
font-size: 30px;
font-weight: 700;
text-align: center;
color: #FFFFFF;
text-shadow: 0px 0px 10px rgba(0,0,0,0.3),
1px 0px 2px rgba(0,0,0,0.1), 
0px 1px 2px rgba(0,0,0,0.1), 
-1px 0px 2px rgba(0,0,0,0.1), 
0px -1px 2px rgba(0,0,0,0.1);
}
.t_mv div.place .text {
font-size: 16px;
margin-left: auto;
margin-right: auto;
line-height: 2em;
text-align: center;
color: #FFFFFF;
}
@media screen and (max-width: 820px) {
.t_mv div.place .title {
font-size:6vw;
}
.t_mv div.place .subtitle {
font-size: 4vw;
text-align: center;
margin-bottom: 10px;
}
.t_mv div.place .text {
font-size: 3.5vw;
}
}
@media screen and (max-width: 767px) {
.t_mv div.place .title {
	font-size: 9.5vw;
	padding-left: 1em;
}
.t_mv div.place .subtitle {
font-size: 4.8vw;
text-align: center;
margin-bottom: 10px;
}
.t_mv div.place .text {
font-size: 3.5vw;
}
}


/*swiper-button prev next　エフェクト*/
[class^="swiper-button-"], .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet, .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet::before {
transition: all .3s ease;
}
.swiper-container:hover .swiper-button-prev,
.swiper-container:hover .swiper-button-next {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1;
visibility: visible;
}
[class^="swiper-button-"] {
/* width: 44px;*/
opacity: 0;
visibility: hidden;
}
.swiper-button-prev {
-webkit-transform: translateX(50px);
transform: translateX(50px);
}
.swiper-button-next {
-webkit-transform: translateX(-50px);
transform: translateX(-50px);
}

/*pagination　cureent2重丸*/
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
margin: 0 9px;
position: relative;
width: 12px;
height: 12px;
background-color: #fff;
opacity: .4;
}
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet::before {
content: '';
position: absolute;
top: 50%;
left: 50%;
width: 18px;
height: 18px;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
border: 0px solid #fff;
border-radius: 50%;
}
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet:hover, .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active {
opacity: 1;
}
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active::before {
border-width: 1px;
}


.swiper-container .swiper-slide:before {
z-index: 0;
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color:rgba(0,0,0,0);
}

/**/
.swiper-wrapper.disabled {
transform: translate3d(0px, 0, 0) !important;
}
.swiper-pagination.disabled {
display: none;
}



/*スクロールダウン全体の場所*/
.scrolldown2{
	/*描画位置※位置は適宜調整してください*/
	position: absolute;
	bottom: 20px;
	left: 50%;
transform: translateX(-50%);
	z-index: 1;
}

/*Scrollテキストの描写*/
.scrolldown2 span{
/*描画位置*/
position: absolute;
left:10px;
bottom:10px;
/*テキストの形状*/
color: #eee;
font-size: 0.7rem;
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:#eee;
/*丸の動き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:1px;
height: 60px;
background:#eee;
}




/*右サイド　バナー*/
.h_bnrs{
display: grid;
grid-template-columns: 1fr;
gap: 10px;
position: fixed;
top: 150px;
right: 0px;
opacity: 0;
animation: S_up 2s;
animation-fill-mode: forwards;
z-index: 4;
}
.h_bnrs .item{
width: 70px;
margin-left: 0px;
}
.h_bnrs .item img{
	width: 100%;
	height: auto;
	display: block;
	border-top: 2px solid #FFFFFF;
	border-bottom: 2px solid #FFFFFF;
	border-left: 2px solid #FFFFFF;
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
}
@keyframes S_up{
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@media screen and (max-width: 767px) {
.h_bnrs{
	display: none;
}
}




/*トップ　イベント　ファミリー*/
.top_family_1::before{
position: absolute;
content: "";
width: 230px;
height: 180px;
display: block;
background-image:url('../images/materials/home_parts/top_family_1.png');
background-size: contain;
background-position: center;
background-repeat: no-repeat;
left: 0px;
top: 10px;
}
@media screen and (max-width: 767px) {
.top_family_1::before{
display: none;
}
}


/*トップ　イベント*/
.sL1th {
padding-top: 60px;
padding-bottom: 60px;
position: relative;
}
.sL1th.ev_archive {
padding-top: 0px;
padding-bottom: 60px;
}
.sL1th.ev_detail {
padding-top: 150px;
padding-bottom: 60px;
}
@media screen and (max-width: 767px) {
.sL1th {
padding-top: 30px;
padding-bottom: 50px;
}
}

/*オプション*/
.Event_opt1 {
padding-top: 0px;
padding-bottom: 0px;
}
.Event_opt1 ul.in_desc {
display: grid;
gap: 40px;
grid-template-columns: 1fr 1fr 1fr;
margin-bottom: 60px;
}
.Event_opt1 figure {
width: 100%;
margin-left: auto;
margin-right: auto;
margin-bottom: 10px;
position: relative;
}
.Event_opt1 figure img {
width: 100%;
height: auto;
display: block;
}
.Event_opt1 ul.in_desc li.item {
position: relative;
transition: all 0.3s;
}

.Event_opt1 ul.in_desc li.item p.update{
padding-top: 0px;
padding-right: 0px;
padding-left: 0px;
padding-bottom: 0px;
color: #000000;
font-size: 11px;
margin-bottom: 0px;
background-color: #EEF81C;
width: 44px;
height: 44px;
line-height: 44px;
text-align: center;
border-radius: 50%;
position: absolute;
left: -15px;
top: -15px;
display: inline-block;
z-index: 3;
}
.Event_opt1 ul.in_desc li.item p.closed{
padding-top: 0px;
padding-right: 0px;
padding-left: 0px;
padding-bottom: 0px;
color: #FFFFFF;
font-size: 11px;
margin-bottom: 0px;
background-color: #ED6C00;
width: 44px;
height: 44px;
line-height: 44px;
text-align: center;
border-radius: 50%;
position: absolute;
right: -15px;
top: -15px;
display: inline-block;
z-index: 3;
}
.Event_opt1 ul.in_desc li.item.i_closed figure {
filter: brightness(40%);
}
.Event_opt1 ul.in_desc li.item p.closed_t {
text-align: center;
color: #FFFFFF;
font-size: 18px;
font-weight: bold;
position: absolute;
z-index: 4;
top: 100px;
width: 100%;
}

.Event_opt1 ul.in_desc li.item h3 {
font-size: 15px;
font-weight: 500;
margin-bottom: 5px;
line-height: 1.8em;
}
.Event_opt1 ul.in_desc li.item p {
color: #666666;
line-height: 1.8em;
}
.Event_opt1 ul.in_desc li.item .link {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 2;
}
.Event_opt1 ul.in_desc li.item:hover{
opacity: 0.65;
z-index: 0;
}
@media screen and (max-width: 820px) {
.Event_opt1 ul.in_desc {
gap: 20px;
}
.Event_opt1 ul.in_desc li.item p.closed_t {
top: 80px;
}
}
@media screen and (max-width: 767px) {
.Event_opt1 {

}
.Event_opt1 ul.in_desc {
gap: 20px;
grid-template-columns: 1fr;
margin-bottom: 30px;
}
.Event_opt1 ul.in_desc li.item h3 {
font-size: 3.6vw;
}
.Event_opt1 ul.in_desc li.item p {
font-size: 3vw;
}
.Event_opt1 ul.in_desc li.item p.closed_t {
top: 100px;
}
}



/*イベント一覧ページ*/
.Event_opt1_D {
padding-top: 0px;
padding-bottom: 0px;
}
.Event_opt1_D ul.in_desc {
display: grid;
gap: 40px;
grid-template-columns: 1fr 1fr 1fr;
margin-bottom: 60px;
}
.Event_opt1_D figure {
width: 100%;
margin-left: auto;
margin-right: auto;
margin-bottom: 10px;
position: relative;
}
.Event_opt1_D figure img {
width: 100%;
height: auto;
display: block;
}
.Event_opt1_D ul.in_desc li.item {
	position: relative;
	transition: all 0.3s;
	background-color: #F5F5F5;
}
.Event_opt1_D ul.in_desc li.item .cat_T {
	margin-bottom: 10px;
}
.Event_opt1_D ul.in_desc li.item p.update{
padding-top: 0px;
padding-right: 0px;
padding-left: 0px;
padding-bottom: 0px;
color: #000000;
font-size: 11px;
margin-bottom: 0px;
background-color: #EEF81C;
width: 44px;
height: 44px;
line-height: 44px;
text-align: center;
border-radius: 50%;
position: absolute;
left: -15px;
top: -15px;
display: inline-block;
z-index: 3;
}
.Event_opt1_D ul.in_desc li.item p.closed{
padding-top: 0px;
padding-right: 0px;
padding-left: 0px;
padding-bottom: 0px;
color: #FFFFFF;
font-size: 11px;
margin-bottom: 0px;
background-color: #ED6C00;
width: 44px;
height: 44px;
line-height: 44px;
text-align: center;
border-radius: 50%;
position: absolute;
right: -15px;
top: -15px;
display: inline-block;
z-index: 3;
}
.Event_opt1_D ul.in_desc li.item.i_closed figure {
filter: brightness(40%);
}
.Event_opt1_D ul.in_desc li.item p.closed_t {
text-align: center;
color: #FFFFFF;
font-size: 18px;
font-weight: bold;
position: absolute;
z-index: 4;
top: 100px;
width: 100%;
}
.Event_opt1_D ul.in_desc li.item .in_Txt {
	display: flex;
	flex-direction: column;
	margin-bottom: 20px;
}
.Event_opt1_D ul.in_desc li.item .Space {
	padding-right: 20px;
	padding-left: 20px;
	padding-bottom: 20px;
	padding-top: 10px;
}


.Event_opt1_D ul.in_desc li.item h3 {
font-size: 15px;
font-weight: 500;
margin-bottom: 5px;
line-height: 1.8em;
}
.Event_opt1_D ul.in_desc li.item p {
	color: #666666;
	line-height: 1.8em;
	margin-bottom: 10px;
}

.Event_opt1_D ul.in_desc li.item p.e_date span,.Event_opt1_D ul.in_desc li.item p.e_time span {
	margin-right: 1em;
}
.Event_opt1_D ul.in_desc li.item p.e_date,.Event_opt1_D ul.in_desc li.item p.e_time {
padding-left:2em;
text-indent:-2em;
}
@media screen and (max-width: 820px) {
.Event_opt1_D ul.in_desc {
gap: 20px;
}
.Event_opt1 ul.in_desc li.item p.closed_t {
top: 80px;
}
}
@media screen and (max-width: 767px) {
.Event_opt1_D {

}
.Event_opt1_D ul.in_desc {
gap: 20px;
grid-template-columns: 1fr;
margin-bottom: 30px;
}
.Event_opt1_D ul.in_desc li.item h3 {
font-size: 3.6vw;
}
.Event_opt1_D ul.in_desc li.item p {
font-size: 3vw;
}
.Event_opt1 ul.in_desc li.item p.closed_t {
top: 100px;
}
}





/*トップ　ウィジェットバナー*/
.widget_bnr {
padding-top: 40px;
padding-bottom: 80px;
position: relative;
}
.widget_bnr .in_bnrs {
display: grid;
gap: 20px;
grid-template-columns: 1fr;
}
.widget_bnr .in_bnrs figure {
width: 100%;
margin-left: auto;
margin-right: auto;
}
.widget_bnr .in_bnrs figure img {
width: 100%;
height: auto;
display: block;
}
@media screen and (max-width: 767px) {
.widget_bnr {
padding-top: 20px;
padding-bottom: 40px;
}
.widget_bnr .in_bnrs {
gap: 10px;
}
}


/*トップ　CMSバナー01*/
.bnr_g01 {
background-image: url(../images/banners/banner_bg.jpg);
background-size: cover;
position: relative;
height: 250px;
margin-top: 70px;
margin-bottom: 120px;
}
.bnr_g01 figure {
width: 650px;
margin-left: auto;
margin-right: auto;
position: absolute;
left: 50%;
top: 45%;
transform: translate(-50%, -50%);
}
.bnr_g01 figure img {
width: 100%;
height: auto;
display: block;
}
@media screen and (max-width: 820px) {
.bnr_g01 {
height: 220px;
margin-top: 40px;
margin-bottom: 80px;
}
.bnr_g01 figure {
width: 67%;
}
}
@media screen and (max-width: 767px) {
.bnr_g01 {
height: 180px;
margin-top: 20px;
margin-bottom: 60px;
}
.bnr_g01 figure {
width: 90%;
}
}


/*トップ　CMSバナー02*/
.bnr_g02 {
margin-top: 80px;
margin-bottom: 40px;
}
.bnr_g02 figure {
width: 100%;
margin-left: auto;
margin-right: auto;
}
.bnr_g02 figure img {
width: 100%;
height: auto;
display: block;
}
@media screen and (max-width: 767px) {
.bnr_g02 {
margin-top: 40px;
margin-bottom: 20px;
}
}


/*トップ　CMSバナー03*/
.bnr_g03 {
margin-top: 0px;
margin-bottom: 60px;
}
.bnr_g03 figure {
width: 60%;
margin-left: auto;
margin-right: auto;
}
.bnr_g03 figure img {
width: 100%;
height: auto;
display: block;
}

/*モデルハウス用*/
.bnr_g03 h3 {
	text-align: center;
	padding-bottom: 10px;
	font-size: 18px;
	font-weight: bold;
}
.bnr_g03 p.guide {
	text-align: center;
	padding-bottom: 10px;
	padding-top: 10px;
}

@media screen and (max-width: 767px) {
.bnr_g03 {
margin-top: 0px;
margin-bottom: 20px;
}
.bnr_g03 figure {
width: 100%;
}
}


/*トップ　イベント　ファミリー*/
.top_family_7::before{
position: absolute;
content: "";
width: 150px;
height: 220px;
display: block;
background-image:url('../images/materials/home_parts/top_family_7.png');
background-size: contain;
background-position: center;
background-repeat: no-repeat;
left: 100px;
top: 20px;
}
@media screen and (max-width: 767px) {
.top_family_7::before{
display: none;
}
}

.top_family_8::before{
position: absolute;
content: "";
width: 200px;
height: 180px;
display: block;
background-image:url('../images/materials/home_parts/top_family_8.png');
background-size: contain;
background-position: center;
background-repeat: no-repeat;
right: 80px;
top: 50px;
}
@media screen and (max-width: 767px) {
.top_family_8::before{
display: none;
}
}

.top_family_9::before{
position: absolute;
content: "";
width: 230px;
height: 100px;
display: block;
background-image: url('../images/materials/home_parts/top_family_9.png');
background-size: contain;
background-position: center;
background-repeat: no-repeat;
left: 20px;
bottom: 50px;
}
@media screen and (max-width: 767px) {
.top_family_9::before{
display: none;
}
}


/*施工事例*/
.sL2th {
padding-top: 80px;
padding-bottom: 80px;
position: relative;
/*background-color: #E1E1E1;*/
}
.sL2th p.guide {
text-align: center;
line-height: 2em;
margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
.sL2th {
padding-top: 40px;
padding-bottom: 40px;
}
.sL2th p.guide {
font-size: 3.3vw;
display: none;
}
}




/*トップ　商品ラインナップ*/
.sL3th {
padding-top: 60px;
padding-bottom: 60px;
position: relative;
}
@media screen and (max-width: 767px) {
.sL3th {
padding-top: 30px;
padding-bottom: 50px;
}
}

/*オプション*/
.Products_opt1 {
padding-top: 0px;
padding-bottom: 0px;
}
.Products_opt1 ul.in_desc {
display: grid;
gap: 30px;
grid-template-columns: 1fr 1fr 1fr;
margin-bottom: 60px;
}
.Products_opt1 figure {
width: 100%;
margin-left: auto;
margin-right: auto;
margin-bottom: 10px;
position: relative;
}
.Products_opt1 figure img {
width: 100%;
height: auto;
display: block;
}
.Products_opt1 ul.in_desc li.item {
position: relative;
transition: all 0.3s;
}
.Products_opt1 ul.in_desc li.item h3 {
	font-size: 16px;
	font-weight: 500;
	margin-bottom: 5px;
	line-height: 2.2em;
	background-color: #000000;
	text-align: center;
	color: #FFFFFF;
	padding-top: 5px;
	padding-bottom: 5px;
}
.Products_opt1 ul.in_desc li.item p {
	padding-bottom: 0px;
	margin-bottom: 10px;
}
.Products_opt1 ul.in_desc li.item p.lead {
	color: #666666;
	text-align: center;
}
.Products_opt1 ul.in_desc li.item p.option {
	color: #000000;
	text-align: center;
}
.Products_opt1 ul.in_desc li.item p.price {
	font-size: 20px;
	color: #ED6C00;
	text-align: center;
	font-weight: bold;
}
.Products_opt1 ul.in_desc li.item p.price strong {
	font-size: 45px;
}
.Products_opt1 ul.in_desc li.item p.price span {
	display: block;
}
.Products_opt1 ul.in_desc li.item .link {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 2;
}
.Products_opt1 ul.in_desc li.item:hover{
opacity: 0.65;
z-index: 0;
}
@media screen and (max-width: 820px) {
.Products_opt1 ul.in_desc {
gap: 10px;
}
.Products_opt1 ul.in_desc li.item p.price {
	font-size: 16px;
}
.Products_opt1 ul.in_desc li.item p.price strong {
	font-size: 40px;
}
}
@media screen and (max-width: 767px) {
.Products_opt1 ul.in_desc {
gap: 20px;
grid-template-columns: 1fr;
margin-bottom: 30px;
}
.Products_opt1 ul.in_desc li.item h3 {
font-size: 3.6vw;
}
.Products_opt1 ul.in_desc li.item p {
font-size: 3.5vw;
}
.Products_opt1 ul.in_desc li.item p.price {
font-size: 4.8vw;
}
.Products_opt1 ul.in_desc li.item p.price strong {
font-size:9.5vw;
}
}


/*カタログプレゼント　右*/
.top_family_3::after{
	position: absolute;
	content: "";
	width: 220px;
	height: 210px;
	display: block;
	background-image: url('../images/materials/home_parts/top_family_3.png');
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	right: 64px;
	bottom: -136px;
	z-index: -1;
}
@media screen and (max-width: 820px) {
.top_family_3::after{
right: 0px;
}
}
@media screen and (max-width: 767px) {
.top_family_3::after{
display: none;
}
}



/*厳選間取りプラン*/
.sL4th {
	padding-top: 40px;
	padding-bottom: 80px;
	position: relative;
	z-index: 0;
}
@media screen and (max-width: 767px) {
.sL4th {
padding-top: 20px;
padding-bottom: 40px;
}
}

/*オプション*/
.sL4th_opt1 {
padding-top: 0px;
padding-bottom: 0px;
}
.sL4th_opt1 figure.gensen {
	margin-bottom: 50px;
}
.sL4th_opt1 ul.in_desc {
display: grid;
gap: 30px;
grid-template-columns: 1fr 1fr;
margin-bottom: 60px;
}
.sL4th_opt1 figure {
width: 100%;
margin-left: auto;
margin-right: auto;
}
.sL4th_opt1 figure img {
width: 100%;
height: auto;
display: block;
}
.sL4th_opt1 ul.in_desc li.item {
border: 2px solid #06B6C9;
position: relative;
}
.sL4th_opt1 ul.in_desc li.item .things {
	padding: 20px;
	transition: all 0.3s;
}
.sL4th_opt1 ul.in_desc li.item h3 {
	font-size: 20px;
	font-weight: bold;
	background-color: #06B6C9;
	color: #FFFFFF;
	text-align: center;
	padding-top: 7px;
	padding-bottom: 7px;
}
.sL4th_opt1 ul.in_desc li.item p.opt1 {
	font-size: 16px;
	color: #06B6C9;
	background-color: #EFEFEF;
	text-align: center;
}
.sL4th_opt1 ul.in_desc li.item.memb p.opt1 {
	background-color: #FFFFFF;
}
.sL4th_opt1 ul.in_desc li.item.memb figure img {
opacity: 0.4;
}
.sL4th_opt1 ul.in_desc li.item p.opt1 span {
	font-size: 20px;
	font-weight: bold;
}
.sL4th_opt1 ul.in_desc li.item .link {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 2;
}
.sL4th_opt1 ul.in_desc li.item.gen:hover .things{
opacity: 0.4;
}
@media screen and (max-width: 767px) {
.sL4th_opt1 {
}
.sL4th_opt1 figure.gensen {
	margin-bottom: 25px;
}
.sL4th_opt1 ul.in_desc {
gap: 20px;
grid-template-columns: 1fr;
margin-bottom: 30px;
}
.sL4th_opt1 ul.in_desc li.item h3 {
font-size: 3.6vw;
}
.sL4th_opt1 ul.in_desc li.item p {
font-size: 3vw;
}
}



/*メンバーログイン*/
.login_nav {
display: flex;
justify-content: center;
align-items: center;
position: absolute;
z-index: 1;
top: 50%;
transform: translateY(-50%);
}
.login_nav ul {
display: flex;
flex-direction: column;
gap: 15px;
align-items: center;
}
.login_nav p.gentei {
font-size: 18px!important;
font-weight: 600;
}
.login_nav .thing a {
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
width: 300px;
height: 50px;
border-radius: 50px;
font-size: 15px;
text-decoration: none;
transition: all 0.3s ease;
}
/* 会員登録ボタン（塗りつぶし） */
.login_nav .thing.area1 a {
background-color: #df7229;
color: #fff;
}
.login_nav .thing.area1 a img {
/*filter: brightness(0) invert(1);*/ /* 白に変換 */
height: 30px;
}
.login_nav .thing.area1 a:hover {
background-color: #F29600;
}
/* ログインボタン（白背景＋オレンジ枠） */
.login_nav .thing.area2 a {
border: 1px solid #df7229;
background-color: #fff;
color: #df7229;
}
.login_nav .thing.area2 a:hover {
background-color: #FDEAD5;
}
.login_nav .thing.area2 a img {
height: 30px;
}

@media screen and (max-width: 767px) {
.login_nav {
transform: translateY(-45%);
}
.login_nav ul {
gap: 10px;
}
.login_nav .thing a {
width: 300px;
height: 50px;
font-size: 3.3vw;
}
.login_nav p.gentei {
font-size: 3.8vw!important;
}
}




/*メンバーログイン　general */
.memb_Gen {
	padding-top: 50px;
	padding-bottom: 50px;
	text-align: center;
}
.memb_Gen h3 {
	font-size: 20px;
	font-weight: bold;
	margin-bottom: 10px;
}
.memb_Gen p.guide {
margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
.memb_Gen {
	padding-top: 30px;
	padding-bottom: 30px;
	text-align: left;
}
.memb_Gen h3 {
font-size: 4.4vw;
}
}

.login_nav_g {
display: flex;
justify-content: center;
align-items: center;
z-index: 1;
}
.login_nav_g ul {
display: flex;
/*flex-direction: column;*/
gap: 15px;
align-items: center;
}
.login_nav_g p.gentei {
font-size: 18px!important;
font-weight: 600;
}
.login_nav_g .thing a {
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
width: 300px;
height: 50px;
border-radius: 50px;
font-size: 15px;
text-decoration: none;
transition: all 0.3s ease;
}
/* 会員登録ボタン（塗りつぶし） */
.login_nav_g .thing.area1 a {
background-color: #df7229;
color: #fff;
}
.login_nav_g .thing.area1 a img {
/*filter: brightness(0) invert(1);*/ /* 白に変換 */
height: 30px;
}
.login_nav_g .thing.area1 a:hover {
background-color: #F29600;
}
/* ログインボタン（白背景＋オレンジ枠） */
.login_nav_g .thing.area2 a {
border: 1px solid #df7229;
background-color: #fff;
color: #df7229;
}
.login_nav_g .thing.area2 a:hover {
background-color: #FDEAD5;
}
.login_nav_g .thing.area2 a img {
height: 30px;
}

@media screen and (max-width: 767px) {
.login_nav_g {

}
.login_nav_g ul {
gap: 10px;
flex-direction: column;
}
.login_nav_g .thing a {
width: 300px;
height: 50px;
font-size: 3.3vw;
}
.login_nav_g p.gentei {
font-size: 3.8vw!important;
}
}




.M_btns {
display: flex;
justify-content: center;
align-items: center;
}
.M_btns ul {
display: grid;
gap: 20px;
grid-template-columns: 1fr 1fr;
}
.M_btns .thing a {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: 280px;
	height: 50px;
	font-size: 15px;
	text-decoration: none;
	transition: all 0.3s ease;
	background-color: #df7229;
	color: #fff;
	position: relative;
}
.M_btns .thing a:hover {
background-color: #F29600;
}
.M_btns .thing a::after {
display: block;
content: "";
position: absolute;
top: 50%;
right: 30px;
width: 8px;
height: 8px;
margin: -4px 0 0 0;
border-top: solid 1px #FFFFFF;
border-right: solid 1px #FFFFFF;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
transition: all 0.3s;
}
@media screen and (max-width: 767px) {
.M_btns ul {
gap: 10px;
}
.M_btns ul {
	width: 100%;
}
.M_btns .thing a {
	height: 50px;
	font-size: 3vw;
	width: auto;
}
.M_btns .thing a::after {
right: 20px;
}
}




/*トップ　選ばれる理由*/
.chosen_th{
	width: 100%;
	background-color: #E4F5F9;
	padding-top: 40px;
	padding-bottom: 60px;
	position: relative;
}
.chosen_th h2.choose{
	text-align: center;
	color: #4BB9D5;
	line-height: 1.3em;
	margin-top: 20px;
	margin-bottom: 20px;
	font-size: 30px;
}
.chosen_th h2.choose span{
	display: block;
	font-size: 16px;
	color: #000000;
}
.chosen_th p.cho_icon{
	position: absolute;
	left: 50%;
	transform: translateX(160%);
	top: 80px;
}
.chosen_th p.cho_icon img{
	width: 220px;
	height: auto;
	display: block;
}
@media screen and (max-width: 767px) {
.chosen_th{
padding-top: 20px;
padding-bottom: 0px;
}
.chosen_th h2.choose{
	line-height: 1.3em;
	margin-top: 15px;
	margin-bottom: 15px;
	font-size: 5.3vw;
}
.chosen_th h2.choose span{
font-size: 3.3vw;
}
/*.chosen_th p.cho_icon{
	position: absolute;
	left: auto;
	transform: translateX(0%);
	top: -20px;
	right: -30px;
}
.chosen_th p.cho_icon img{
	width: 160px;
}*/
}


.to_reason {
	max-width: 1200px;
	margin-right: auto;
	margin-left: auto;
	padding-left: 3%;
	padding-right: 3%;
}	
.to_reason ul.in_desc {
display: grid;
gap: 20px;
grid-template-columns: 1fr 1fr 1fr;
margin-bottom: 20px;
list-style: none;
}
.to_reason ul.in_desc figure img {
width: 100%;
height: auto;
}
.to_reason ul.in_desc li.item {
	padding: 20px;
	background-color: #FFFFFF;
	text-align: center;
}
.to_reason ul.in_desc li.item h3 {
	font-size: 14px;
	margin-bottom: 5px;
	line-height: 2em;
}
.to_reason ul.in_desc li.item h3 strong {
	font-size: 24px;
	font-weight: bold;
	display: block;
	color: #4BB9D5;
}
.to_reason ul.in_desc li.item h3 strong i {
	font-size: 20px;
	padding-left: 5px;
}
@media screen and (max-width: 820px) {
.to_reason ul.in_desc li.item {
	padding: 15px;
}
.to_reason ul.in_desc li.item h3 strong {
	font-size: 16px;
}
.to_reason ul.in_desc li.item h3 {
	font-size: 11px;
	line-height: 2em;
}
}
@media screen and (max-width: 767px) {
.to_reason {
padding-bottom: 50px;
}
.to_reason ul.in_desc {
gap: 20px;
grid-template-columns: 1fr;
}
.to_reason ul.in_desc li.item h3 {
font-size: 3.6vw;
}
.to_reason ul.in_desc li.item h3 strong {
font-size: 6.2vw;
}
}




/*品質*/
.sL5th {
padding-top: 60px;
padding-bottom: 200px;
position: relative;
z-index: 0;

background:
linear-gradient(90deg, #FFF 0%, #FFF 45%, #F0EEE5 45%, #F0EEE5 100%) no-repeat,
#FFF;
background-size: 100% calc(100% - 400px); /* 230px上 + 170px下 = 400px を引く */
background-position: top 230px left;
}
@media screen and (max-width: 767px) {
.sL5th {
padding-top: 40px;
padding-bottom: 40px;

background:
linear-gradient(180deg, #FFF 0%, #FFF 55%, #F0EEE5 55%, #F0EEE5 100%) no-repeat,
#FFF;
background-size: 100% 90%;
background-position: top 80px left;
}
}

/*オプション*/
.sL5th_opt1 {
	padding-top: 0px;
	padding-bottom: 0px;
}
.sL5th_opt1 ul.in_desc {
display: grid;
gap: 30px;
grid-template-columns: 1fr 1fr 1fr;
margin-bottom: 0px;
}
.sL5th_opt1 figure {
width: 100%;
margin-left: auto;
margin-right: auto;
}
.sL5th_opt1 figure img {
width: 100%;
height: auto;
display: block;
}
.sL5th_opt1 ul.in_desc li.item {
position: relative;
}
.sL5th_opt1 ul.in_desc li.item h3 {
font-size: 16px;
font-weight: 500;
}
.sL5th_opt1 ul.in_desc li.item .link {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 2;
}
.sL5th_opt1 ul.in_desc li.item:hover{
background-color: rgba(204,204,204,0.10);
z-index: 0;
}
@media screen and (max-width: 767px) {
.sL5th_opt1 {

}
.sL5th_opt1 ul.in_desc {
gap: 20px;
grid-template-columns: 1fr 1fr;
margin-bottom: 30px;
}
.sL5th_opt1 ul.in_desc li.item h3 {
font-size: 3.6vw;
}
.sL5th_opt1 ul.in_desc li.item p {
font-size: 3vw;
}
}



/*オプション*/
.sL5th_opt2 {
	padding-top: 0px;
	padding-bottom: 0px;
}
.sL5th_opt2 .in_desc {
display: grid;
gap: 50px;
grid-template-columns: 1fr 1fr;
margin-bottom: 0px;
}
.sL5th_opt2 .in_desc .item1 h3 {
font-size: 22px;
font-weight: 600;
margin-bottom: 30px;
line-height: 1.8em;
color: #ED6C00;
}
.sL5th_opt2 .in_desc .item1 p {
	margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
.sL5th_opt2 {
}
.sL5th_opt2 .in_desc {
gap: 20px;
grid-template-columns: 1fr;
margin-bottom: 30px;
}
.sL5th_opt2 .in_desc .item1 h3 {
font-size: 4.6vw;
}
.sL5th_opt2 .in_desc .item1 p {

}
}




.t_family_5 {
position: absolute;
left: 50%;
transform: translateX(-300%);
width: 180px;
aspect-ratio: 34 / 38;
background-image: url(../images/materials/home_parts/top_family_5.png);
background-size: contain;
background-repeat: no-repeat;
z-index: 1;
bottom: 0px;
}

.t_photo_4 {
position: absolute;
left: 50%;
transform: translateX(-140%);
width: 200px;
aspect-ratio: 40 / 26;
background-image: url(../images/materials/home_parts/top_photo_4.png);
background-size: contain;
background-repeat: no-repeat;
z-index: 1;
bottom: 80px;
}

@media screen and (max-width: 767px) {
.t_family_5 {
	display: none;
}
.t_photo_4 {
	display: none;
}
}




/*店舗＆モデルハウスのご紹介*/
.sL6th {
padding-top: 20px;
padding-bottom: 50px;
position: relative;
}
.sL6th p.guide {
text-align: center;
line-height: 2em;
margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
.sL6th {
padding-top: 40px;
padding-bottom: 20px;
}
.sL6th p.guide {
font-size: 3.3vw;
display: none;
}
}



/*トップ　店舗ボタン*/
.mHs_btns {
display: flex;
justify-content: center;
align-items: center;
}
.mHs_btns ul {
display: grid;
gap: 0px;
grid-template-columns: 1fr 1fr;
width: 100%;
}
.mHs_btns .thing:first-child a {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: auto;
	height: 50px;
	font-size: 15px;
	text-decoration: none;
	transition: all 0.3s ease;
	background-color: #FFF;
	color: #333;
	position: relative;
	border: 1px solid #DF7229;
	box-sizing: border-box;
}
.mHs_btns .thing:last-child a,.mHs_btns .thing.e_end:last-child {
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
width: auto;
height: 50px;
font-size: 15px;
text-decoration: none;
transition: all 0.3s ease;
background-color: #df7229;
color: #fff;
position: relative;
}
.mHs_btns .thing:first-child a:hover {
	background-color: rgba(242,150,0,0.30);
}
.mHs_btns .thing a:hover {
background-color: #F29600;
}
.mHs_btns .thing.e_end:last-child {
background-color: #999999;
}
@media screen and (max-width: 767px) {
.mHs_btns ul {
width: 100%;
}
.mHs_btns .thing a {
height: 50px;
font-size: 3vw;
width: auto;
}
.mHs_btns .thing a::after {
right: 20px;
}
}


/*オーナーズインタビュー*/
.sL7th {
padding-top: 0px;
padding-bottom: 40px;
position: relative;
z-index: 0;
background-color: #FFFFFF;
}
@media screen and (max-width: 767px) {
.sL7th {
padding-top: 0px;
padding-bottom: 20px;
}
}

/*オプション*/
.sL7th_opt1 {
padding-top: 0px;
padding-bottom: 0px;
background-color: #FFFFFF;
}

.sL7th_opt1 ul.in_desc {
display: grid;
gap: 0px;
grid-template-columns: 1fr 1fr;
margin-bottom: 0px;
}
.sL7th_opt1 figure {
width: 100%;
margin-left: auto;
margin-right: auto;
}
.sL7th_opt1 figure img {
width: 100%;
height: auto;
display: block;
}
.sL7th_opt1 ul.in_desc li.item:last-child {
	display: flex;
	align-items: center;
	position: relative;
	background-image: url(../parts/watercolor_bg.jpg);
	padding-left: 30px;
}

.sL7th_opt1 ul.in_desc li.item h3 {
	font-size: 32px;
	font-weight: bold;
	margin-bottom: 20px;
}
.sL7th_opt1 ul.in_desc li.item h3 span {
	display: block;
	color: #FFFFFF;
	font-family: "Damion", serif;
	font-weight: 400;
	font-style: normal;
	margin-top: 10px;
	font-size: 28px;
}
.sL7th_opt1 ul.in_desc li.item p {
	color: #FFFFFF;
}
.sL7th_opt1 ul.in_desc li.item span.arrow {
	position: absolute;
	right: 30px;
	bottom: 30px;
}
.sL7th_opt1 ul.in_desc li.item .link {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 2;
}
@media screen and (max-width: 767px) {
.sL7th_opt1 {
}
.sL7th_opt1 ul.in_desc {
grid-template-columns: 1fr;
}
.sL7th_opt1 ul.in_desc li.item:last-child {
	background-image: url(../parts/watercolor_bg.jpg);
	padding-left: 20px;
	padding-top: 40px;
	padding-bottom: 40px;
}
.sL7th_opt1 ul.in_desc li.item h3 {
font-size: 5.6vw;
}
.sL7th_opt1 ul.in_desc li.item p {
font-size: 3vw;
}
}





/*コラム*/
.sL8th {
padding-top: 40px;
padding-bottom: 80px;
position: relative;
z-index: 0;
}
@media screen and (max-width: 767px) {
.sL8th {
padding-top: 20px;
padding-bottom: 40px;
}
}

/*オプション*/
.sL8th_opt1 {
padding-top: 0px;
padding-bottom: 50px;
}
.sL8th_opt1 ul.in_desc {
display: grid;
gap: 30px;
grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
margin-bottom: 60px;
}
.sL8th_opt1 figure {
width: 100%;
margin-left: auto;
margin-right: auto;
}
.sL8th_opt1 figure img {
width: 100%;
height: auto;
display: block;
}
.sL8th_opt1 ul.in_desc li.item {
position: relative;
}
.sL8th_opt1 ul.in_desc li.item h3 a {
	font-size: 13px;
	font-weight: 400;
	display: block;
	background-color: #ED6C00;
	color: #FFFFFF;
	text-align: center;
}
.sL8th_opt1 ul.in_desc li.item p {
	margin-bottom: 10px;
}

@media screen and (max-width: 767px) {
.sL8th_opt1 {
padding-top: 0px;
padding-bottom: 0px;
}
.sL8th_opt1 ul.in_desc {
gap: 30px 15px;
grid-template-columns: 1fr 1fr;
margin-bottom: 50px;
}
.sL8th_opt1 ul.in_desc li.item h3 {
font-size: 3.6vw;
}
.sL8th_opt1 ul.in_desc li.item p {
font-size: 3vw;
}
}


/*カテゴリー　コラム　イベント*/
.cat_T {
display: flex;
flex-wrap: wrap;
gap: 5px;
align-content: flex-start; /* これが重要 */
align-items: flex-start;    /* 念のため追加 */
}

.cat_T span,.cat_T span a {
color: #FFFFFF;
background-color: #ED6C00;
padding-left: 9px;
padding-right: 9px;
font-size: 11px;
text-decoration: none;
display: inline-block;
}

@media screen and (max-width: 767px) {
.cat_T span a {
font-size: 2.5vw;
}
}



.t_family_11 {
position: absolute;
left: 50%;
transform: translateX(-350%);
width: 180px;
aspect-ratio: 34 / 36;
background-image: url(../images/materials/home_parts/top_family_11.png);
background-size: contain;
background-repeat: no-repeat;
z-index: 1;
top: 0px;
}

.t_family_12 {
position: absolute;
left: 50%;
transform: translateX(200%);
width: 200px;
aspect-ratio: 42 / 40;
background-image: url(../images/materials/home_parts/top_family_12.png);
background-size: contain;
background-repeat: no-repeat;
z-index: 1;
bottom: 30px;
}

.t_family_13 {
position: absolute;
left: 50%;
transform: translateX(-300%);
width: 200px;
aspect-ratio: 44 / 42;
background-image: url(../images/materials/home_parts/top_family_13.png);
background-size: contain;
background-repeat: no-repeat;
z-index: 1;
bottom: 0px;
}

@media screen and (max-width: 767px) {
.t_family_11 {
width: 120px;
left: -20px;
transform: translateX(0%);
}
.t_photo_12 {
display: none;
}
.t_photo_13 {
display: none;
}
}




/*ブログ一覧*/
.sL9th {
padding-top: 20px;
padding-bottom: 80px;
position: relative;
z-index: 0;
}
@media screen and (max-width: 767px) {
.sL9th {
padding-top: 10px;
padding-bottom: 50px;
}
}



/*お知らせ一覧*/
.top_news {
	margin-bottom: 0px;
}
.top_news .item {
display: flex;
gap: 20px;
border-bottom: 1px solid #CCCCCC;
padding-bottom: 30px;
padding-top: 30px;
position: relative;
z-index: 1;
transition: all 0.3s;
}
.top_news .item .updated {
	background-color: #ED6C00;
	color: #FFFFFF;
	font-size: 12px;
	line-height: 1.5em;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 0px;
	position: absolute;
	left: 0px;
	border-radius: 20px;
	top: 10px;
}
.top_news .item .in_if01 p {

}
.top_news .item .in_if01b {
	flex-basis: 16%;
	background-color: #F29600;
	color: #FFFFFF;
	text-align: center;
	font-size: 10px;
	align-self: start;
}
.top_news .item .in_if01b.info{background-color: #24A2DD;}	
.top_news .item .in_if01b.happy{background-color: #EC4F5B;}	
.top_news .item .in_if01b.smile{background-color: #A15BD1;}	
.top_news .item .in_if01b.update{background-color: #23B05F;}
.top_news .item .in_if02 {
	flex-basis: 65%;
}
.top_news .item .link {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 2;
}
.top_news .item:hover{
z-index: 0;
background-color: rgba(204,204,204,0.10);
}

@media(max-width: 767px){
.top_news .item {
gap: 0px;
flex-direction: column;
padding-bottom: 15px;
padding-top: 15px;
}
.top_news .item .in_if01 p {
margin-right: 20px;
}
.top_news .item .in_if01b {
	width: 40%;
}
.top_news .item .updated {
font-size: 2.3vw;
padding-left: 10px;
padding-right: 10px;
top: 20px;
left: auto;
right: 0px;
line-height: 1.8em;
}
}

/*お知らせ　タブ設定*/
.tab_N{
	display: grid;
	gap: 5px;
	grid-template-columns: 1fr 1fr 1fr;
	width: 50%;
	margin-left: 0px;
	margin-right: auto;
}
.tab_N li a{
	display: block;
	background: #ededed;
	padding-top: 10px;
	padding-bottom: 10px;
	text-align: center;
}
/*liにactiveクラスがついた時の形状*/
.tab_N li.active a{
	background: #fff;
	border-bottom: 3px solid #ED6C00;
}
/*エリアの表示非表示と形状*/
.area {
	display: none;/*はじめは非表示*/
	opacity: 0;/*透過0*/
	background: #fff;
	padding-top: 30px;
	padding-bottom: 50px;
}
/*areaにis-activeというクラスがついた時の形状*/
.area.is-active {
display: block;/*表示*/
animation-name: displayAnime;/*ふわっと表示させるためのアニメーション*/
animation-duration: 2s;
animation-fill-mode: forwards;
}

@keyframes displayAnime{
from {
opacity: 0;
}
to {
opacity: 1;
}
}

@media screen and (max-width: 767px) {
.tab_N{
width: 100%;
}
.tab_N li a{
	font-size: 3vw;
}
.area {
	padding-top: 20px;
	padding-bottom: 20px;
}
}



/*トップ　Instaバナー*/
.bnr_Insta {
	margin-top: 80px;
	margin-bottom: 60px;
	background-image: url(../parts/bginsta_bg.webp);
	aspect-ratio: 200 / 45.3; /* ここで縦横比を指定（例：16:9） */
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	width: 100%; /* 幅をブラウザ幅に合わせる */
	position: relative;
	display:flex;
align-items:center;
transition: all 0.3s;
}
.bnr_Insta figure {
width: 540px;
margin-left: auto;
margin-right: auto;
}
.bnr_Insta figure img {
width: 100%;
height: auto;
display: block;
}
.bnr_Insta .link {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 2;
}
.bnr_Insta:hover{
opacity: 0.6;
z-index: 0;
}
@media screen and (max-width: 767px) {
.bnr_Insta {
	margin-top: 40px;
	margin-bottom: 30px;
}
.bnr_Insta figure {
width: 100%;
}
}



/*フッターバナー*/
.sL10th {
padding-top: 60px;
padding-bottom: 80px;
position: relative;
z-index: 0;
}
@media screen and (max-width: 767px) {
.sL10th {
padding-top: 30px;
padding-bottom: 40px;
}
}

/*オプション*/
.sL10th_opt1 {
}

.sL10th_opt1 ul.in_desc {
display: grid;
gap: 30px 50px;
grid-template-columns: 1fr 1fr;
margin-bottom: 0px;
}
.sL10th_opt1 figure {
width: 100%;
margin-left: auto;
margin-right: auto;
}
.sL10th_opt1 figure img {
width: 100%;
height: auto;
display: block;
}
.sL10th_opt1 ul.in_desc li.item {
position: relative;
}
@media screen and (max-width: 767px) {
.sL10th_opt1 {
}
.sL10th_opt1 ul.in_desc {
gap: 20px;
grid-template-columns: 1fr;
margin-bottom: 0px;
}
}




































































/*PAGE TOP（上へ）*/
/*リンクの形状*/
#page-top a{
display: flex;
justify-content: center;
align-items: center;
background-color: #ED6C00;
border-radius: 50%;
width: 60px;
height: 60px;
color: #fff;
text-align: center;
text-transform: uppercase;
text-decoration: none;
transition: all 0.3s;
}
#page-top a:hover{
background-color: #ED6C00;
}
#page-top span{
display: inline-block;
width: 13px;
height: 13px;
border-top:1px solid #FFFFFF;
border-left: 1px solid #FFFFFF;
transform: rotate(45deg);
margin: 8px 0 0 0;
}
/*リンクを右下に固定*/
#page-top {
position: fixed;
right: 50px;
bottom:150px;
z-index: 1;
/*はじめは非表示*/
opacity: 0;
transform: translateY(100px);
}

/*　上に上がる動き　*/

#page-top.UpMove{
animation: UpAnime 0.5s forwards;
}
@keyframes UpAnime{
from {
opacity: 0;
transform: translateY(300px);
}
to {
opacity: 1;
transform: translateY(0);
}
}

/*　下に下がる動き　*/

#page-top.DownMove{
animation: DownAnime 0.5s forwards;
}
@keyframes DownAnime{
from {
opacity: 1;
transform: translateY(0);
}
to {
opacity: 1;
transform: translateY(300px);
}
}
@media screen and (max-width: 767px) {
#page-top {
position: fixed;
right: 5%;
bottom: 15%;
display: none;
}
}



/*外部リンク　アイコン設定*/
i.fa-external-link {
margin-left: 10px;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
a:hover i.fa-external-link{
margin-left: 15px;
color: #FF0004;
}

/*reCAPTCHA　ロゴの場所を変更*/
.grecaptcha-badge {
bottom: 0px !important;
}


/*ユーチューブ*/
.youtube {
width: 100%;
padding-top: 56.25%;
position: relative;
top: 0;
left: 0;
}
.youtube iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
}



/*固定フッター*/
.fixnav {
width: 100%;
gap: 1px;
grid-template-columns: 1fr 1fr 1fr 1fr;
padding-top: 0px;
padding-bottom: 0px;
position: fixed;
bottom: 0px;
display: none;
z-index: 1;
background-color: #FFFFFF;
}
.fixnav .item.area1 {
grid-row: 1 / 2;
grid-column: 1 / 3;
}
.fixnav .item.area2 {
grid-row: 1 / 2;
grid-column: 3 / 5;
}
.fixnav .item {
background-color: #FFFFFF;
position: relative;
transition: all 0.3s;
}
.fixnav .item p {
	width: 100%;
	height: auto;
}
.fixnav .item p img {
width: 100%;
height: auto;
display: block;
}
@media screen and (max-width: 767px) {
.fixnav {
display: grid;
}
}










/* フッター */
footer{
padding-top: 50px;
padding-bottom: 100px;
margin: 0;
background-color: #FFFFFF;
}
footer p.copyright {
text-align: center;
font-size: 12px;
padding-top: 40px;
}
@media screen and (max-width: 767px) {
footer{
padding-top: 30px;
padding-bottom: 150px;
}
footer p.copyright {
font-size: 3vw;
padding-top: 20px;
}
}

.f_nav {
display: grid;
gap: 50px;
grid-template-columns: 1fr 1.8fr 1fr;
padding-bottom: 30px;
}
.f_nav .item img {
width: 100%;
height: auto;
display: block;
margin-top: 3px;
}
@media(max-width: 767px){
.f_nav {
grid-template-columns: 1fr;
gap: 0px;
}
.f_nav .item figure {
width: 55%;
margin-left: auto;
margin-right: auto;
}
.f_nav .item p {
text-align: center;
}
.f_nav .item p.copyright {
text-align: center;
font-size: 2.3vw;
}

.row_nav{
padding: 0 6%;
}
}


/*foot　アイコンナビ*/
.f_main {
	width: 100%;
}
.f_main .in_desc.i_btns {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
	/*display: flex;*/
	justify-content: center;
	flex-wrap: wrap;
	gap: 80px;
	margin-bottom: 30px;
}
.f_main .in_desc.i_btns .f_btn a {
	display: flex;
	align-items: center;
	text-decoration: none;
	font-weight: bold;
	font-size: 18px;
	color: #ED6C00;
}

.f_main .in_desc.i_btns .f_btn a p {
  display: flex;
  align-items: center;
  gap: 15px;
  margin: 0;
}

.f_main .in_desc.i_btns .f_btn a i {
  width: 60px;
  height: 60px;
  background: #ED6C00;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.f_main .in_desc.i_btns .f_btn a i img {
  width: 40px;
  height: 40px;
}
@media(max-width: 1100px){
.f_main .in_desc.i_btns {
	gap: 60px;
}
}
@media(max-width: 820px){
.f_main .in_desc.i_btns {
	gap: 30px;
}
.f_main .in_desc.i_btns .f_btn a {
	font-size: 16px;
}
.f_main .in_desc.i_btns .f_btn a i {
  width: 40px;
  height: 40px;
}

.f_main .in_desc.i_btns .f_btn a i img {
  width: 28px;
  height: 28px;
}
}

@media(max-width: 767px){
.f_main .in_desc.i_btns {
  grid-template-columns: 1fr 1fr;
	gap: 10px;
	margin-bottom: 30px;
}
.f_main .in_desc.i_btns .f_btn a p {
  gap: 10px;
}
.f_main .in_desc.i_btns .f_btn a {
	font-size: 14px;
}
}




/*footナビ2*/
.f_nav2 {
margin-bottom: 0px;
font-size: 3.5vw;}	
.f_nav2 ul.in_desc {
display: grid;
grid-template-columns: 1.2fr 1fr 1fr 1.2fr 1fr 1fr;
gap: 0px;
padding-bottom: 40px;
font-size: 13px;
}

.f_nav2 ul.in_desc li.item {

}
.f_nav2 ul.in_desc li.item h3 a,.f_nav2 ul.in_desc li.item h3{
padding-top: 2px;
padding-bottom: 2px;
display: block;
font-weight: normal;
color: #ED6C00;
font-size: 14px;
}
.f_nav2 ul.in_desc li.item p a{
padding-top: 2px;
padding-bottom: 2px;
display: block;
}
.f_nav2 ul.in_desc li.item p a:hover,.f_nav2 ul.in_desc li.item h3 a:hover{
color: #666666;
}
@media screen and (max-width: 820px) {
.f_nav2 ul.in_desc {
grid-template-columns: 1fr 1fr 1fr 1fr;
gap: 20px 0px;
}

}
@media screen and (max-width: 767px) {
.f_nav2 ul.in_desc.menu {
/*display: none;*/
}
.f_nav2 ul.in_desc {
grid-template-columns: 1.1fr 1fr;
gap: 20px 0px;
padding-bottom: 40px;
font-size: 13px;
}

}


/*SNS nav*/
.flex_sns {
display: flex;
justify-content: center;
gap: 10px;
}
.flex_sns.sponly {
display: none;
}
.flex_sns .item {
}
.flex_sns .item img {
width: 30px;
height: auto;
}
@media screen and (max-width: 767px) {
.flex_sns {
width: 40%;
margin-left: auto;
margin-right: auto;
gap: 20px;
}
.flex_sns.sponly {
display: flex;
}
.flex_sns .item {
}
.flex_sns .item img {
width: 100%;
height: auto;
display: block;
}
}


/*その他*/
ul.others {
display: flex;
gap: 0px;
flex-wrap: wrap;
padding-bottom: 30px;
}
ul.others li.item p {
font-size: 12px;
padding-left: 0px;
padding-right: 30px;
}
@media screen and (max-width: 767px) {
ul.others {

}
}






























.top_family_2{position: relative;}

@media (min-width: 640px) {
.top_family_2::before{
position: absolute;
content: "";
width: 240px;
height: 180px;
display: block;
background-image:url('../images/materials/home_parts/top_family_2.png');
background-size: contain;
background-position: center;
background-repeat: no-repeat;
right: -40px;
top: -42px;
}
}

@media (min-width: 960px) {
.top_family_2::before{
position: absolute;
content: "";
width: 240px;
height: 180px;
display: block;
background-image:url('../images/materials/home_parts/top_family_2.png');
background-size: contain;
background-position: center;
background-repeat: no-repeat;
right: 64px;
top: -42px;
}
}
@media (min-width: 1200px) {
.top_family_2::before{
position: absolute;
content: "";
width: 240px;
height: 180px;
display: block;
background-image:url('../images/materials/home_parts/top_family_2.png');
background-size: contain;
background-position: center;
background-repeat: no-repeat;
right: 64px;
top: -42px;
}
}
.top_family_3{position: relative;}



.top_family_4{position: relative;}
p.photos img{box-shadow: 0 2px 16px 0 rgba(0,0,0,0.10);
margin-bottom: 24px;}
.top_family_4::before {
position: absolute;
content: "";
width: 120px;
height: 200px;
display: block;
background-image: url(../images/materials/home_parts/top_family_4.png);
background-size: contain;
background-position: center;
background-repeat: no-repeat;
top: 0px;
z-index: 3;
left: unset;
right: 0px;
}

@media (min-width: 960px) {
.top_family_4::before{
position: absolute;
content: "";
width: 120px;
height: 200px;
display: block;
background-image: url(../images/materials/home_parts/top_family_4.png);
background-size: contain;
background-position: center;
background-repeat: no-repeat;
top: -60px;
z-index: 3;
left: 121px;
}
}
.top_photo_3{position: relative;}
@media (min-width: 640px) {
.top_photo_3::before {
position: absolute;
content: "";
width: 170px;
height: 190px;
display: block;
background-image: url(../images/materials/home_parts/top_family_5.png);
background-size: contain;
background-position: center;
background-repeat: no-repeat;
left: 0;
top: -240px;
}
}
@media (min-width: 960px) {
.top_photo_3::before{
position: absolute;
content: "";
width: 210px;
height: 140px;
display: block;
background-image: url(../images/materials/home_parts/top_photo_3.png);
background-size: contain;
background-position: center;
background-repeat: no-repeat;
left: 0px;
top: -90px;
}
}






.top_family_5 {
position: relative;
right: 0;
top: 0;
margin: auto;
height: auto;
bottom: 0;
}
.left_lead_box {
margin-top: 40px;
}




.top_family_6{position: relative; margin-bottom: 130px; margin-top: 129px;}


.top_family_6::before {
position: absolute;
content: "";
width: 270px;
height: 210px;
display: block;
background-image: url(../images/materials/home_parts/top_family_6.png);
background-size: contain;
background-position: center;
background-repeat: no-repeat;
right: 0;
top: -128px;
}
@media (min-width: 640px) {

.top_family_6{margin-top: 0;}	

.top_family_6::before {
position: absolute;
content: "";
width: 270px;
height: 210px;
display: block;
background-image: url(../images/materials/home_parts/top_family_6.png);
background-size: contain;
background-position: center;
background-repeat: no-repeat;
right: 0px;
top: -132px;
}
}
@media (min-width: 960px) {
.top_family_6 {
margin-bottom: 100px;
}
.top_family_6::before {
position: absolute;
content: "";
width: 270px;
height: 210px;
display: block;
background-image: url(../images/materials/home_parts/top_family_6.png);
background-size: contain;
background-position: center;
background-repeat: no-repeat;
right: 64px;
top: -128px;
}
}


.mb147{margin-bottom:24px;}
@media (min-width: 960px) {
.mb147{margin-bottom: 147px;}
}
@media (min-width: 1200px) {
.mb147{margin-bottom: 147px;}
}

.mb121{margin-bottom: 121px;}

.top_photo_1{position: relative;}


.top_photo_1::after {
position: absolute;
content: "";
width: 231px;
height: 148px;
display: block;
background-image: url(../images/materials/home_parts/top_photo_1.png);
background-size: contain;
background-position: center;
background-repeat: no-repeat;
top: -64px;
right: -40px;
z-index: 4;
}




@media (min-width: 960px) {

.top_photo_1::after{
position: absolute;
content: "";
width: 231px;
height: 148px;
display: block;
background-image: url(../images/materials/home_parts/top_photo_1.png);
background-size: contain;
background-position: center;
background-repeat: no-repeat;
top: -168px;
right: -40px;
}
}
@media (min-width: 1200px) {
.top_photo_1::after{
position: absolute;
content: "";
width: 231px;
height: 148px;
display: block;
background-image: url(../images/materials/home_parts/top_photo_1.png);
background-size: contain;
background-position: center;
background-repeat: no-repeat;
top: -128px;
right: 64px;
}
}
.mg-mi-56{
margin-right: -64px;
}





.pc56sp0 {
margin-bottom: 56px;
}
.top_family_14{position: relative; }
.top_family_14::after {
position: absolute;
content: "";
width: 200px;
height: 180px;
display: block;
background-image: url(../images/materials/home_parts/top_family_14.png);
background-size: contain;
background-position: center;
background-repeat: no-repeat;
right: 64px;
bottom: -180px;
}
.top_photo_2{position: relative;}

.top_photo_2::before {
position: absolute;
content: "";
width: 236px;
height: 152px;
display: block;
background-image: url(../images/materials/home_parts/top_photo_2.png);
background-size: contain;
background-position: center;
background-repeat: no-repeat;
bottom: 0px;
left: -24px;
}



@media (min-width: 960px) {
.top_photo_2::before{
position: absolute;
content: "";
width: 236px;
height: 152px;
display: block;
background-image: url(../images/materials/home_parts/top_photo_2.png);
background-size: contain;
background-position: center;
background-repeat: no-repeat;
bottom: -96px;
}
}

@media (min-width: 1200px) {
.top_photo_2::before{
position: absolute;
content: "";
width: 236px;
height: 152px;
display: block;
background-image: url(../images/materials/home_parts/top_photo_2.png);
background-size: contain;
background-position: center;
background-repeat: no-repeat;
bottom: -96px;
}
}



.bg-orange-images{
background-image: url(../images/materials/watercolor_bg.jpg);
}
.top_family_10{position: relative; }
@media (min-width: 640px) {
.top_family_10::after {
position: absolute;
content: "";
width: 130px;
height: 180px;
display: block;
background-image: url(../images/materials/home_parts/top_family_10.png);
background-size: contain;
background-position: center;
background-repeat: no-repeat;
right: 40px;
top: -140px;
}
}




