@charset "utf-8";

@media all and (min-width:1161px) {
	#ds-index {font-size:1.9rem; line-height:1.8;}
}
@media all and (min-width:1025px) and (max-width:1160px) {
	#ds-index {font-size:1.8rem; line-height:1.7;}
}
@media all and (min-width:901px) and (max-width:1024px) {
	#ds-index {font-size:1.7rem; line-height:1.7;}
}
@media all and (min-width:831px) and (max-width:900px) {
	#ds-index {font-size:1.5rem; line-height:1.6;}
}
@media all and (min-width:769px) and (max-width:830px) {
	#ds-index {font-size:1.4rem; line-height:1.6;}
}
@media all and (max-width:768px) { /* MOBILE */
	#ds-index {font-size:1.3rem; line-height:1.5;}
}

@-webkit-keyframes ds-index-img-scale {100% {transform:scale(1.05,1.05);}}
@-moz-keyframes ds-index-img-scale {100% {transform:scale(1.05,1.05);}}
@keyframes ds-index-img-scale {100% {transform:scale(1.05,1.05);}}

.ds-img-scale {overflow:hidden;}
.ds-img-scale img {
	-webkit-animation: ds-index-img-scale 20s 1s infinite ease alternate;
	-moz-animation: ds-index-img-scale 20s 1s infinite ease alternate;
	animation: ds-index-img-scale 20s 1s infinite ease alternate;
}

/* SWIPER SETTING*/
.swiper-slide-active *[class*="ds-swiper-prx"] {opacity:1!important; transform:translate(0, 0) scale(1, 1)!important; transition-property:opacity, transform!important; transition-timing-function: ease-out;
}
 *[class*="ds-swiper-prx"] {opacity:0; transition-duration:1s; transform:translate(0,100%);}
 .ds-swiper-prx-1 {transition-delay:0.5s;} .ds-swiper-prx-2 {transition-delay:1.0s;} .ds-swiper-prx-3 {transition-delay:1.5s;} .ds-swiper-prx-4 {transition-delay:2.0s;} .ds-swiper-prx-5 {transition-delay:2.5s;} .ds-swiper-prx-6 {transition-delay:3.0s;} .ds-swiper-prx-7 {transition-delay:3.5s;} .ds-swiper-prx-8 {transition-delay:4.0s;} .ds-swiper-prx-9 {transition-delay:4.5s;} .ds-swiper-prx-10 {transition-delay:5.0s;} .ds-swiper-prx-11 {transition-delay:5.5s;} .ds-swiper-prx-12 {transition-delay:6.0s;} .ds-swiper-prx-13 {transition-delay:6.5s;} .ds-swiper-prx-14 {transition-delay:7.0s;} .ds-swiper-prx-15 {transition-delay:7.5s;}
 
.ds-index-hn {margin-top:0; text-align:center; line-height:1.6;}
h2.ds-index-hn {font-size:2.2em; font-weight:normal;}
h2.ds-index-hn span {display:block; transition-duration:2s;}
h2.ds-index-hn small {font-weight:bold; font-size:0.7em;}
h2.ds-index-hn [data-aos]:nth-of-type(1) {transition-delay:0s;}
h2.ds-index-hn [data-aos]:nth-of-type(2) {transition-delay:0.5s;}

@media all and (max-width:768px) { /* MOBILE */
	h2.ds-index-hn {font-size:1.4em;}
}
#ds-index button {cursor:pointer}
#ds-index a:hover {transform:scale(101.5%,101.5%);}

/*INDEX 01*/
#ds-index-01 *[data-aos] {transition-duration:1s;}
#ds-index-01-main {display:flex; margin:0; padding:0; list-style:none; align-items:stretch; justify-content:space-between; text-align:center; position:relative;}

#ds-index-01-main>li {width:25%; transition:all 0.5s; background-size:cover; background-position:center center; position:relative; height:45em;}

#ds-index-01-main>li:hover {width:40%;}
/* #ds-index-01-main>li:hover>a:after, */
/* #ds-index-01-main>li:hover>a:before {content:""; display:block; height:100%; width:5em; background:blue} */

#ds-index-01-main>li>a {position:relative; top:0; left:0; width:100%; height:100%; display:flex; flex-direction:column; align-items:center;  box-sizing:border-box; /*padding:15em 1%*/ justify-content:center;}

.ds-index-main-box {position:relative; width:80%; display:flex; justify-content:center; align-items:center; padding-top:1em;}

.ds-index-main-box:before {position:absolute; content:""; display:block; background:#f4a400; width:9.5em; height:0; padding-bottom:9.5em; border-radius:100%; transition:all 0.5s; top:0; z-index:0;}
#ds-index-01-main>li:hover .ds-index-main-box:before {width:18em; height:0; padding-bottom:18em;}

/* #ds-index-01-main>li:hover .ds-index-main-box>div:before {width:100%; height:100%; } */

.ds-index-main-box>div>* {display:block; z-index:1; position:relative;}
.ds-index-main-box>div img {height:5.6em; margin-top:0.8em;}

#ds-index-01-main small {border:3px solid #fff; width:3em; margin:1.5em auto; opacity:0; transition:all 0.5s;}
#ds-index-01-main>li:hover small {opacity:1;}

#ds-index-01-main strong {font-size:2.1em; font-weight:800; line-height:1.3;}
#ds-index-01-main span {font-size:1.2em; margin-top:0.4em;}

@media all and (min-width:1025px) and (max-width:1160px) {
	#ds-index-01-main {font-size:0.95em;}
}
@media all and (min-width:901px) and (max-width:1024px) {
	#ds-index-01-main {font-size:0.9em;}
}
@media all and (max-width:900px) {
	#ds-index-01-main {flex-wrap:wrap;}
	#ds-index-01-main>li {flex-basis:50%!important;  height:25em;}
	#ds-index-01-main {font-size:0.85em;}
	
}


/* INDEX 02 */

.ds-index-02-box>a {display:flex; justify-content:space-between; align-items:stretch; background-repeat:no-repeat; background-size:contain; background-position: left 10% bottom;}
.ds-index-02-box-right>a {flex-direction:row-reverse; background-position: right 10% bottom;}

.ds-index-02-box-img {display:flex; align-items:center; flex:0 0 25%; }
.ds-index-02-box-right .ds-index-02-box-img {justify-content:flex-end;}
.ds-index-02-box-img img {display:block; max-width:70%; max-height:100%; width:auto; height:auto; margin:15% 10%;}

.ds-index-02-box-img>div {margin:10% 0; border:3px solid #fff; border-radius:5%; display:flex; justify-content:center; align-items:center;}
.ds-index-02-box-text {flex:1; text-align:center; margin:5% 0;}
.ds-index-02-box-text>* {display:block;}
.ds-index-02-box-text>* {display:block;}

.ds-index-02-box strong {display:block; font-size:2.8em; font-weight:800;}
.ds-index-02-box span {display:block; font-size:2em; font-weight:800;}
.ds-index-02-box p {font-size:1.7em; font-weight:700;}

.ds-index-02-box button {display:inline-block; cursor:pointer; border:none; line-height:1; padding:1.1em 1em; border-radius:100%;}
.ds-index-02-box button img {display:block; width:2em; height:2em;}

.ds-index-02 *[data-aos] {transition-duration:2s!important;}
.ds-index-02 strong[data-aos] {transition-delay:0s!important;}
.ds-index-02 span[data-aos] {transition-delay:0.2s!important;}
.ds-index-02 p[data-aos] {transition-delay:0.5s!important;}

@media all and (max-width:768px) { /* MOBILE */
	.ds-index-02-box>a {background-position: left -10% bottom; padding-left:1em; padding-right:1em; box-sizing:border-box;}
	.ds-index-02-box-right>a {background-position: right -10% bottom;}
	.ds-index-02-box-img {flex:0 0 15%; }
	.ds-index-02-box strong {font-size:1.8em;}
	.ds-index-02-box span {font-size:1em;}
	.ds-index-02-box p {font-size:1.1em;}
}

/* INDEX 03 */

#ds-index-03-main {display:flex; flex-wrap:wrap; justify-content:space-between; align-items:stretch; gap:1em 0}
#ds-index-03-main>li {flex:0 1 49.5%;}
#ds-index-03-main>li>a {display:block; box-sizing:border-box; padding:5% 5% 0 5%;}
#ds-index-03-main>li>a>div>* {line-height:1.3; display:block;}
#ds-index-03-main>li>a>div>*~* {margin-top:3%;}

#ds-index-03 strong {font-size:2.6em; font-weight:800;}
#ds-index-03 span {font-size:1.6em; font-weight:800;}

#ds-index-03 button {font-size:1.2em; border:none; padding:0.5em 1em; border-radius:1em; line-height:1;}

#ds-index-03 img {display:block; max-width:80%; height:auto; margin:5% auto 0 auto;}

@media all and (max-width:768px) { /* MOBILE */
	#ds-index-03-main {gap:0.5em 0;}
	#ds-index-03-main>li {flex:0 0 49.3%;}
	#ds-index-03 strong {font-size:1.5em;}
	#ds-index-03 span {font-size:1.1em;}

	#ds-index-03 button {font-size:1.0em;}
}