/* 커서 */
.cursor{ position: fixed; width: calc(410 / 1920 * 100%); z-index: 98; pointer-events: none; opacity: 0; transform: translate(-50%, -50%); overflow: hidden; background-color: #333; }
.cursor::after{ content: ''; display: block; padding-bottom: calc(415 / 620 * 100%); }
.cursor div{
	width: 100%; height: 100%; position: absolute; left: 0; top: 0; transition-duration: 0.2s; opacity: 0;
	display: flex; align-items: center; justify-content: center;
}
.cursor div.on{ opacity: 1; }
.cursor div img{width: 100%; height: 100%; object-fit: cover;}
.cursor div p{
	font-size: 24px; font-weight: 600; color: #fff;
	position: absolute; line-height: 1.4; text-align: center;
}

body.on ._m{ opacity: 1; }

._m{ width: 100%; overflow: hidden; position: relative; word-break: keep-all;  transition-duration: 0.6s; opacity: 0; }
._m .se01{ width: 100%; position: relative; overflow: hidden; padding-bottom: 300px; }
._m .se01 .pin{ padding-top: 140px; box-sizing: border-box; }
._m .se01 .pin .flexbx{ width: 100%; display: flex; align-items: flex-start; padding-left: 2.5%; justify-content: space-between; box-sizing: border-box; }
._m .se01 .pin .flexbx .vidbx{ width: 45%; max-width: 530px; position: relative; padding-top: 25px; }
._m .se01 .pin .flexbx .vidbx em{ font-size: 20px; font-weight: 300; line-height: 1.3; padding-bottom: 10px; display: block; }
._m .se01 .pin .flexbx .vidbx .vidWrap{ width: 100%; position: relative; padding-bottom: calc(300 / 530 * 100%); color: #fff;  background-color: #000; }
._m .se01 .pin .flexbx .vidbx .vidWrap::before,
._m .se01 .pin .flexbx .vidbx .vidWrap::after {
	content:''; display: block; position: absolute; width: 100%; height: 2px; background-color: #fff; left: 0;
}
._m .se01 .pin .flexbx .vidbx .vidWrap::before{top: -1px;}
._m .se01 .pin .flexbx .vidbx .vidWrap::after{bottom: -1px;}
/* ._m .se01 .pin .flexbx .vidbx .vidWrap::after{ content: ''; display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background-image: url(/asset/img/main/se01_video_filter.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; mix-blend-mode: soft-light; z-index: 0; } */
._m .se01 .pin .flexbx .vidbx .vidWrap iframe{ width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
._m .se01 .pin .flexbx .vidbx .vidWrap > p{ position: absolute; left: 0; bottom: 0; padding: 20px 30px; box-sizing: border-box; width: 100%; font-size: 20px; letter-spacing: -0.045em; line-height: 1.3; z-index: 4; }
._m .se01 .pin .flexbx .vidbx .vidWrap > .controls{ position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); opacity: 0.7; transition-duration: 0.2s; cursor: pointer; z-index: 3; }
._m .se01 .pin .flexbx .vidbx .vidWrap > .controls i{ display: block; font-size: 20px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); transition-duration: 0.2s; }
._m .se01 .pin .flexbx .vidbx .vidWrap > .controls i.xi-play{ padding-left: 5px; }
._m .se01 .pin .flexbx .vidbx .vidWrap > .controls i.xi-pause{ opacity: 0; }

._m .se01 .pin .flexbx .vidbx .vidWrap > .controls.on i.xi-play{ opacity: 0; }
._m .se01 .pin .flexbx .vidbx .vidWrap > .controls.on i.xi-pause{ opacity: 1; }

@keyframes rotate {
    0%{ transform: rotate(0deg); }
    100%{ transform: rotate(360deg); }
}

@media screen and (min-width: 821px){
    ._m .se01 .pin .flexbx .vidbx .vidWrap > .controls:hover{ opacity: 1; }
    ._m .se01 .pin .flexbx .vidbx .vidWrap > .controls:hover img{ animation: rotate 6s infinite linear; }
}


._m .se01 .pin .flexbx .rightbx{ width: 50%; max-width: 740px; display: flex; align-items: flex-start; }
._m .se01 .pin .flexbx .rightbx .vertical{ padding-right: 22px; box-sizing: border-box; }
._m .se01 .pin .flexbx .rightbx .vertical .text{ margin-bottom: 100px; font-size: 20px; font-weight: 700; width: 1em; }

._m .se01 .pin .flexbx .rightbx .vertical .text .ani_box{ overflow: hidden; }
._m .se01 .pin .flexbx .rightbx .vertical .text .ani_box .cube{ font-weight: 700; perspective: 82.5rem; position: relative; height: 4em; width: 100%; }
._m .se01 .pin .flexbx .rightbx .vertical .text .ani_box .cube strong{ position: absolute; color: #000; position: absolute; top: 0; right: 0; display: block; transform-style: preserve-3d; transform-style: preserve-3d; backface-visibility: hidden; transform-origin: center center -0.4em; }
._m .se01 .pin .flexbx .rightbx .vertical .text .ani_box .cube strong.gray{ color: #908e8f; }

._m .se01 .pin .flexbx .rightbx .vertical .text strong{ display: block; writing-mode: vertical-lr; }

._m .se01 .pin .flexbx .rightbx .imgbx{ overflow: hidden; }


._m .se01 .scroll{ box-sizing: border-box; margin-top: -1.05em; position: relative; z-index: 4; font-size: 16.1458vw; }
._m .se01 .scroll h1{ overflow: hidden; width: 100%; display: block; height: 1.23em; }
._m .se01 .scroll .mainlist{ margin-top: 40px; width: 100%; position: relative; border-top: 1px solid rgba(0,0,0,0.5); }
._m .se01 .scroll .mainlist li{ width: 100%; border-bottom: 1px solid rgba(0,0,0,0.5); padding: 15px 0; transition-duration: 0.4s; cursor: pointer; }
._m .se01 .scroll .mainlist li .wrap{ display: flex; justify-content: space-between; font-size: 5.2083vw; }
._m .se01 .scroll .mainlist li span{ font-weight: 700; }

@media screen and (min-width: 821px){
    ._m .se01 .scroll .mainlist li:hover{ background-color: #000; color: #fff; }
}


@media screen and (max-width: 1280px){
    ._m .se01{ padding-bottom: 200px; }
    ._m .se01 .pin{ padding-top: 120px; }
    ._m .se01 .pin .flexbx .vidbx em{ font-size: 16px; }
    ._m .se01 .pin .flexbx .vidbx .vidWrap > p{ font-size: 16px; padding: 15px 20px; }
    ._m .se01 .pin .flexbx .rightbx .vertical .text{ font-size: 16px; margin-bottom: 60px; }
    ._m .se01 .scroll{ margin-top: -0.7em; }
}

@media screen and (max-width: 820px){
    ._m .se01{ padding-bottom: 160px; }
    ._m .se01 .pin{ padding-top: 70px; }
    ._m .se01 .pin .flexbx{ flex-direction: column; padding-left: 5%; }
    ._m .se01 .pin .flexbx .vidbx{ width: 60%; padding: 0; }
    ._m .se01 .pin .flexbx .rightbx{ margin-left: auto; width: 80%; margin-top: 40px; }

    ._m .se01 .scroll .mainlist{ margin-top: 20px; }
}

@media screen and (max-width: 500px){
    ._m .se01{ padding-bottom: 100px; }
    ._m .se01 .pin .flexbx .vidbx{ width: 100%; max-width: 300px; padding-right: 5%; box-sizing: border-box; }
    ._m .se01 .pin .flexbx .vidbx em{ font-size: 14px; }
    ._m .se01 .pin .flexbx .vidbx .vidWrap > .controls{ width: 50px; }
    ._m .se01 .pin .flexbx .vidbx .vidWrap > p{ font-size: 14px; padding: 10px 15px; }
    ._m .se01 .pin .flexbx .rightbx{ width: 100%; }
    ._m .se01 .pin .flexbx .rightbx .vertical .text{ font-size: 14px; margin-bottom: 30px; }

    ._m .se01 .scroll{ margin-top: -0.5em; }
    ._m .se01 .scroll .mainlist{ margin-top: 0; }
    ._m .se01 .scroll .mainlist li{ padding: 10px 0; }
}


._m .se02{ width: 100%; box-sizing: border-box; overflow: hidden; position: relative; }
._m .se02 .bg{ width: 100%; background-repeat: no-repeat; background-position: center; background-size: cover; z-index: 0; }
._m .se02 .bg::after{ content: ''; display: block; padding-bottom: calc(960 / 1920 * 100%); background-color: rgba(0,0,0,0.5); }
._m .se02 .split{ box-sizing: border-box; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; }
._m .se02 .split .bx{ width: 100%; height: 20%; display: flex; }
._m .se02 .split .bx > div{ background-color: #000; margin-top: -1%; }
._m .se02 .wrap{ height: 100%; display: flex; align-items: center; justify-content: center; position: relative; z-index: 3; position: absolute; left: 2.5%; top: 0; }
._m .se02 .wrap .bigTitle{ font-size: 6.7708vw; text-align: center; color: #fff; font-weight: 500; }
._m .se02 .wrap .bigTitle strong{ display: block; overflow: hidden; margin-bottom: 30px; }
._m .se02 .wrap .bigTitle strong:last-of-type{ margin-bottom: 0; }
._m .se02 .wrap .bigTitle strong span{ display: block; }


._m .se03{ width: 100%; position: relative; overflow: hidden; height: calc(var(--vh,1vh) * 100); box-sizing: border-box; }
._m .se03 .bg{ width: 100%; height: 100%; position: absolute; left: 0; top: 0; overflow: hidden; background-repeat: no-repeat; background-position: center; background-size: cover; z-index: 0; filter: brightness(0.5);}
._m .se03 .bg em{ display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 0; background-color: #000; transform-origin: 0 0; }
._m .se03 .wrap { height: 100%; box-sizing: border-box; padding: 70px 0; display: flex; align-items: center; flex-direction: column; justify-content: center; position: relative; z-index: 2; }
._m .se03 .center dl{ text-align: center; }
._m .se03 .center dl dt{ font-size: 20px; font-weight: 300; color: #a4a4a4; margin-bottom: 17px; overflow: hidden; }
._m .se03 .center dl dt span{ display: block; }
._m .se03 .center dl dd{ font-size: 85px; letter-spacing: -0.025em; font-weight: 600; line-height: calc(117 / 85); overflow: hidden; color: #fff; }
._m .se03 .center dl dd span{ display: block; }

._m .se03 .lbx{ position: absolute; left: 5%; top: 10%; }
._m .se03 .rbx{ position: absolute; right: 0; bottom: 8%; }
._m .se03 .mark{ font-size: 22px; color: #cdfd50; font-weight: 500; margin-bottom: 15px; overflow: hidden; }
._m .se03 .mark em{ display: block; }
._m .se03 .txt{ font-size: 20px; font-weight: 300; letter-spacing: -0.025em; font-family: 'Pretendard'; line-height: 1.4; overflow: hidden; color: #fff; }
._m .se03 .txt span{ display: block; }

@media screen and (max-width: 1280px){
    ._m .se03 .mark{ font-size: 18px; }
    ._m .se03 .txt{ font-size: 16px; }
    ._m .se03 .center dl dt{ font-size: 16px; margin-bottom: 10px; }
    ._m .se03 .center dl dd{ font-size: 60px; }
}

@media screen and (max-width: 820px){
    ._m .se03 .mark{ font-size: 16px; margin-bottom: 10px; }
    ._m .se03 .txt{ font-size: 14px; }
    ._m .se03 .center dl dt{ font-size: 14px; }
    ._m .se03 .center dl dd{ font-size: 8vw; }
}

@media screen and (max-width: 500px){
    ._m .se03 .txt{ font-size: 12px; }
    ._m .se03 .lbx{ left: 0; }
    ._m .se03 .rbx{ right: 0; text-align: right; }
}


._m .se04{ width: 100%; position: relative; overflow: hidden; background-color: #cdfd50; min-height: calc(var(--vh,1vh) * 100);}
._m .se04 .colorbg{background-color: #cdfd50; width: 100%; height: calc(var(--vh,1vh) * 100); position: absolute; left: 0; top: 0; z-index: 6; pointer-events: none;}
/*  */
._m .se04 .colorbg svg{ width: max(5%,80px); position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
/* ._m .se04 .colorbg svg path{ fill: #cdfd50; } */

._m .se04 .contents{ width: 100%; position: relative; padding: 105px 0; padding-bottom: 200px; display: flex; flex-direction: column; box-sizing: border-box;  }
._m .se04 .contents .bgimg{ position: absolute; left: 0; top: 0; width: 100%; background-repeat: no-repeat; background-position: left center; background-size: cover; z-index: 0; }
._m .se04 .contents .inn{ position: relative; z-index: 2; flex-shrink: 0; }
._m .se04 .contents .sideTitle{ font-size: 35px; letter-spacing: -0.045em; font-family: 'Pretendard'; font-weight: 700; overflow: hidden; text-align: right; padding-right: calc(95 / 1920 * 100%); box-sizing: border-box; }
._m .se04 .contents .sideTitle span{ display: block; width: 100%; }

._m .se04 .contents .txtplay{ overflow: hidden; width: 100%; display: flex; }
._m .se04 .contents .txtplay .inner{ display: flex; font-size: 11.9792vw; font-weight: 700; overflow: hidden; text-transform: uppercase; }
._m .se04 .contents .txtplay .inner strong{ display: inline-block; white-space: nowrap; box-sizing: border-box; animation: flow 20s linear infinite; padding-right: 0.3em;}

@keyframes flow {
    0%{ transform: translateX(0); }
    100%{ transform: translateX(-100%); }
}

._m .se04 .contents .sideTxt{ font-size: 18px; letter-spacing: -0.045em; font-family: 'Pretendard'; line-height: calc(26 / 18); padding-right: calc(95 / 1920 * 100%); text-align: right; }

._m .se04 .hori{ display: flex; position: relative; z-index: 5; height: 100%; align-items: center; }
._m .se04 .hori .genlist{
	display: flex; justify-content: center; align-items: center;  margin-top: 70px; flex-wrap: nowrap;
	width: 100%; gap: 40px;
}
._m .se04 .hori .genlist .box{
	word-break: keep-all; text-align: center;  font-family: 'Pretendard'; position: relative;
	display: flex; justify-content: center;
}
._m .se04 .hori .genlist .box .circle{
	border-radius: 50%; background-color: #fff;
	width: 240px; height: 240px; display: flex; align-items: center; justify-content: center;
}
._m .se04 .hori .genlist .box .circle span{ font-size: 23px; font-weight: 700; line-height: 1.4;}
._m .se04 .hori .genlist .box .circle span span{display: inline-block;}
._m .se04 .hori .genlist .box dl{ margin-top: 25px; }
._m .se04 .hori .genlist .box dl dt{ font-size: 20px; letter-spacing: -0.045em; line-height: 1.3; }
._m .se04 .hori .genlist .box dl dd{ font-size: 60px; line-height: 1.3; font-weight: 700; margin-top: -0.1em; }

._m .se04 .hori .genlist .box .bottomtxt{
	position: absolute; top: 100%; margin-top: 30px;
}
._m .se04 .hori .genlist .box .bottomtxt strong{ font-size: 25px; letter-spacing: -0.045em; font-family: 'Pretendard'; line-height: 1.3; display: block; font-weight: 700; }
._m .se04 .hori .genlist .box .bottomtxt span{ display: block; font-size: 18px; letter-spacing: -0.045em; line-height: 1.3; margin-top: 7px; white-space: nowrap;}




/* 검정 */
._m .se04 .hori .genlist .box .circle.black{ filter: invert(1); width: 300px; height: 300px; border-radius: 50%;}
._m .se04 .hori .genlist .box .circle.black span{display: block; width: 75%;}
._m .se04 .hori .genlist .box .circle.black span img{width: 100%;}


/* 화살표 */
._m .se04 .hori .genlist .arrow{
	box-sizing: border-box;
	display: flex; font-size: 50px; font-weight: 700; color: #fff;
}
._m .se04 .hori .genlist .arrow i{animation: opacity forwards infinite 2s linear;}
._m .se04 .hori .genlist .arrow i:nth-child(2){margin: 0 -0.5em;}

._m .se04 .hori .genlist .arrow i:nth-child(1){}
._m .se04 .hori .genlist .arrow i:nth-child(2){animation-delay: 0.1s;}
._m .se04 .hori .genlist .arrow i:nth-child(3){animation-delay: 0.2s;}

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

._m .se04 .bar{ width: 98%; margin: 0 auto; position: relative; height: 10px; z-index: 5; position: absolute; bottom: 20px; left: 1%; }
._m .se04 .bar span{ display: block; width: 10%; height: 100%; background-color: #000;position: absolute; left: 0; top: 0; }




@media screen and (max-width: 1280px){
    ._m .se04 .contents .sideTitle{ font-size: 30px; }
    ._m .se04 .contents .sideTxt{ font-size: 16px; }

	/* 하단 */
	._m .se04 .hori .genlist{gap: 20px;}
	._m .se04 .hori .genlist .box .circle{width: 210px; height: 210px;}
	._m .se04 .hori .genlist .box .circle span{font-size: 18px;}
	._m .se04 .hori .genlist .arrow{font-size: 40px;}

	._m .se04 .hori .genlist .box .circle.black{width: 260px; height: 260px;}
	._m .se04 .hori .genlist .box .circle.black span{max-width: 150px;}

	._m .se04 .hori .genlist .box .bottomtxt strong{font-size: 20px;}
	._m .se04 .hori .genlist .box .bottomtxt span{font-size: 14px;}
}

@media screen and (max-width: 1024px){

	/* 하단 */
	._m .se04 .hori .genlist{gap: 20px;}
	._m .se04 .hori .genlist .box .circle{width: 180px; height: 180px;}
	._m .se04 .hori .genlist .box .circle span{font-size: 16px;}
	._m .se04 .hori .genlist .arrow{font-size: 30px;}

	._m .se04 .hori .genlist .box .circle.black{width: 240px; height: 240px;}

	._m .se04 .hori .genlist .box .bottomtxt strong{font-size: 20px;}
	._m .se04 .hori .genlist .box .bottomtxt span{font-size: 14px;}


	/* 영문 */
	html.en ._m .se04 .hori .genlist .box .bottomtxt span{white-space: unset;}
}

@media screen and (max-width: 820px){
	._m .se04 .contents{padding: 120px 0;}
    ._m .se04 .contents .sideTitle{ font-size: 24px; }
    ._m .se04 .contents .sideTxt{ font-size: 14px; }
    ._m .se04 .contents .txtplay{ margin: 20px 0; }
    ._m .se04 .contents .bgimg{ background-size: 200%; }


	/* 하단 */
	._m .se04 .hori .genlist{flex-direction: column; gap: 30px; width: 90%; max-width: 540px; margin: 0 auto; margin-top: 40px;}
	._m .se04 .hori .genlist .box{flex-direction: column; align-items: center; width: 100%;}

	._m .se04 .hori .genlist .box .circle{border-radius: 20px; width: 100%; min-height: 140px; height: auto; padding: 20px; box-sizing: border-box;}
	._m .se04 .hori .genlist .box .circle span{font-size: 24px;}
	._m .se04 .hori .genlist .box .bottomtxt{position: unset;}

	._m .se04 .hori .genlist .arrow{flex-direction: column; color: #000;}
	._m .se04 .hori .genlist .arrow i{transform: rotate(90deg);}
	._m .se04 .hori .genlist .arrow i:nth-child(2){margin: -0.5em 0;}

	/* ._m .se04 .hori .genlist .box .circle.black{border-radius: 20px; width: 100%; height: auto;} */

	._m .se04 .hori .genlist .box .bottomtxt strong{font-size: 20px;}
	._m .se04 .hori .genlist .box .bottomtxt span{font-size: 16px;}
}

@media screen and (max-width: 500px){
    ._m .se04 .contents .sideTitle{ font-size: 24px; }
    ._m .se04 .contents .txtplay .inner{ font-size: 24vw; }


	/* 하단 */
	._m .se04 .hori .genlist{}
	._m .se04 .hori .genlist .box .circle{border-radius: 8px; padding: 40px 20px; min-height: 100px;}
	._m .se04 .hori .genlist .box .circle span{font-size: 20px;}

	._m .se04 .hori .genlist .box .bottomtxt strong{font-size: 18px;}
	._m .se04 .hori .genlist .box .bottomtxt span{font-size: 16px;}
}



._m .se05{ width: 100%; position: relative; overflow: hidden;}
._m .se05 .video{width: 100%; display: flex; align-items: center; justify-content: center;}
._m .se05 .video::before {
	content:''; display: block; width: 100%; padding-bottom: calc(9/16*100%);
	background-color: #000; opacity: 0.5; position: relative; z-index: 1;
}
._m .se05 .video iframe {
	width: 30%; height: 30%;
	transform-origin: center;
	transform: scale(3.333);
	/* width: 120px; height: 120px; */
	position: absolute;
}
._m .se05 .wrap{
	position: absolute; z-index: 2; color: #fff; box-sizing: border-box; display: flex;
	flex-direction: column; justify-content: flex-end;
	left: 50%; top: 0; height: 100%; transform: translateX(-50%);
	padding-bottom: 75px;
}
._m .se05 .wrap dl dt{ font-size: 32px; letter-spacing: -0.045em; font-weight: 600; color: rgba(255,255,255,0.7); font-family: 'Pretendard'; line-height: 1.4; margin-bottom: 30px; }
._m .se05 .wrap dl dd{ font-size: 80px; letter-spacing: -0.045em; font-weight: 600; font-family: 'Pretendard'; line-height: calc(106 / 80); overflow: hidden; }
._m .se05 .wrap dl dd > span{ display: block; }
._m .se05 .wrap dl dd b{ color: #b6ee2a; }

@media screen and (max-width: 1280px){
    ._m .se05 .wrap dl dt{ font-size: 26px; margin-bottom: 20px; }
    ._m .se05 .wrap dl dd{ font-size: 60px; }
}

@media screen and (max-width: 820px){
    ._m .se05{}
    ._m .se05 .wrap{ padding-bottom: 40px; }
    ._m .se05 .wrap dl dt{ font-size: 18px; margin-bottom: 15px; }
    ._m .se05 .wrap dl dd{ font-size: 35px; }
}

@media screen and (max-width: 500px){
	._m .se05 .wrap{ padding-bottom: 20px; }
    ._m .se05 .wrap dl dt{ font-size: 14px; }
    ._m .se05 .wrap dl dd{ font-size: 6.4vw; }
}


._m .se06{ width: 100%; position: relative; overflow: hidden; padding-top: 205px; }
._m .se06 dl dt{ font-size: 22px; letter-spacing: -0.045em; font-family: 'Pretendard'; font-weight: 500; }
._m .se06 dl dd{ font-size: 15.625vw; color: #b6ee2a; font-weight: 700; white-space: nowrap; }
._m .se06 .flexbx{ display: flex; width: 100%; max-width: 1360px; margin: 0 auto; justify-content: space-between; align-items: center; }

._m .se06 .flexbx .count{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; flex-direction: column; box-sizing: border-box; }
._m .se06 .flexbx .count span{ font-size: 10.4167vw; font-size: 8vw; color: #000; font-weight: 700; display: block; transition-duration: 0.4s; }
._m .se06 .flexbx em{
	font-size: 24px; letter-spacing: -0.045em; font-weight: 700; font-family: 'Pretendard'; transition-duration: 0.4s; color: #000; text-align: center; line-height: calc(36 / 24);
	max-width: 90%;
}
._m .se06 .flexbx .over{ width: 100%; height: 100%; position: absolute; left: 0; top: 0; text-align: center; padding: 20px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; flex-direction: column; transition-duration: 0.4s; opacity: 0; }
._m .se06 .flexbx .over > p{ font-size: 24px; letter-spacing: -0.045em; font-family: 'Pretendard'; font-weight: 600; line-height: calc(40 / 26); box-sizing: border-box; }

._m .se06 .flexbx > div{ text-align: center; box-sizing: border-box; cursor: pointer; }
._m .se06 .flexbx > div::after{ content: ''; display: block; padding-bottom: 100%; }

._m .se06 .flexbx .lbx{ width: calc(420 / 1360 * 100%); border: 1px solid #000; z-index: 2; background-color: #fff; }
._m .se06 .flexbx .lbx::after{ padding-bottom: calc(360 / 420 * 100%); }

._m .se06 .flexbx .center{ border-radius: 50%; background-color: #000; width: calc(400 / 1360 * 100%); position: relative; }
._m .se06 .flexbx .center .over > p{ color: #fff; }
._m .se06 .flexbx .center .count span{ color: #fff; }
._m .se06 .flexbx .center .count em{ color: #fff; }

._m .se06 .flexbx .rbx{ width: calc(380 / 1360 * 100%); background-color: #ccfd50; }
._m .se06 .flexbx .rbx::after{ padding-bottom: calc(360 / 380 * 100%); }


._m .se06 .flexbx > div:hover .count span{ opacity: 0.1; }
._m .se06 .flexbx > div:hover .count em{ opacity: 0; }
._m .se06 .flexbx > div:hover .over{ opacity: 1; }


@media screen and (max-width: 1280px){
    ._m .se06{ padding: 160px 0; }
    ._m .se06 dl dt{ font-size: 18px; }
    ._m .se06 .flexbx em{ font-size: 18px; }
    ._m .se06 .flexbx .rbx{ padding: 30px 20px; }
    ._m .se06 .flexbx .over > p{ font-size: 18px; }
}

@media screen and (max-width: 820px){
    ._m .se06{ padding: 100px 0; }
    ._m .se06 dl dt{ font-size: 16px; }

    ._m .se06 .flexbx em{ font-size: 14px; }
    ._m .se06 .flexbx .lbx{ padding: 20px 10px; }
    ._m .se06 .flexbx .center em{ padding: 0 10px; }
    ._m .se06 .flexbx .center em br{ display: none; }
    ._m .se06 .flexbx .rbx{ padding: 20px 10px; }

    ._m .se06 .flexbx .over > p{ font-size: 14px; }
}

@media screen and (max-width: 500px){
    ._m .se06 dl dd{ white-space: unset; margin-top: 20px; font-size: 13.625vw; }
    ._m .se06 .flexbx{ flex-direction: column; margin-top: 50px; }
    ._m .se06 .flexbx .count span{ font-size: 20vw; }
    ._m .se06 .flexbx .center em{ padding: 0 20px; }
    ._m .se06 .flexbx .lbx{ width: 80%; max-width: 280px; margin-right: auto; }
    ._m .se06 .flexbx .center{ width: 70%; max-width: 220px; margin-left: auto; margin-top: 30px; }

    ._m .se06 .flexbx .rbx{ width: 60%; max-width: 280px; margin-top: 30px; }
}

