/* custom */
:root {
    --color:#a31d22;
}

/* ==========================
   Language Font
========================== */

/* 국문 / 영문 : Pretendard */
body.main,
body.eng {
    font-family: 'Pretendard', sans-serif;
}

body.main input,
body.main textarea,
body.main select,
body.main button,
body.eng input,
body.eng textarea,
body.eng select,
body.eng button {
    font-family: 'Pretendard', sans-serif;
}

/* 국문 / 영문 굵기 */
body.main .ptm,
body.eng .ptm {
    font-family: 'Pretendard', sans-serif;
    font-weight: 500;
}

body.main .ptsb,
body.eng .ptsb {
    font-family: 'Pretendard', sans-serif;
    font-weight: 600;
}

body.main .ptb,
body.eng .ptb {
    font-family: 'Pretendard', sans-serif;
    font-weight: 700;
}

body.main .pteb,
body.eng .pteb {
    font-family: 'Pretendard', sans-serif;
    font-weight: 800;
}


/* 일본어 */
body.jpn {
    font-family: 'Noto Sans JP', sans-serif;
}

body.jpn input,
body.jpn textarea,
body.jpn select,
body.jpn button {
    font-family: 'Noto Sans JP', sans-serif;
}

body.jpn .ptm {
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 500;
}

body.jpn .ptsb {
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 600;
}

body.jpn .ptb {
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 700;
}

body.jpn .pteb {
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 700;
}


.cp { color:var(--color); }
.cb { color:#fff; background:var(--color); }
.shd { box-shadow: 0 10px 10px rgba(0,0,0,0.6); }
.inner { max-width:1200px; }

.w_btn { display:inline-flex; padding:0 60px; line-height:60px; border-radius: 60px; font-size:16px; align-items: center; justify-content: center; background: var(--color); color:#fff; transition:0.3s; box-sizing: border-box; border:1px solid var(--color); }
.w_btn:hover { background: #fff; color:var(--color); }

/* header & footer */
#w_header { position: fixed; left: 0; top: 0;  width: 100%; z-index: 10; transition:0.3s; height: 80px; color:#fff; transition:0.3s; overflow: hidden;  }
#w_header.fix { background: rgba(0,0,0,0.6); backdrop-filter: blur(10px); }
#w_header .wrap { height: 80px; width: 1400px; }
#w_header.up { top:-81px; background: rgba(0,0,0,0.6); backdrop-filter: blur(10px); }
#w_header.down { height: 280px; background: rgba(0,0,0,0.6); backdrop-filter: blur(10px); }
#w_header #w_gnb { gap: 80px; height: 80px; }
#w_header #w_gnb > li > a { position: relative; }
#w_header #w_gnb > li > a:after { content:""; width: 100%; height: 3px; background: var(--color); position: absolute; bottom: -14px; left: 0; display: none; }
#w_header #w_gnb > li.select > a:after { display: block; }
#w_header #w_gnb ul { position: absolute; padding-top: 20px; color:#ccc; line-height: 2.4; }


/* ==========================
   Language
========================== */
#w_header .lang{ position:relative; display:flex; align-items:center; margin-left:40px;}
#w_header #lang_btn{ width:40px; height:40px; display:flex; align-items:center; justify-content:center; cursor:pointer;}
#w_header #lang_btn img{ display:block;}

/* body로 이동하므로 #w_header 제거 */
.lang_menu{ position:fixed; top:50px; right:0; display:none; min-width:90px; background:rgba(0,0,0,.92); border-radius:8px; overflow:hidden; z-index:99999;}
.lang_menu.on{ display:block;}
.lang_menu li{ border-bottom:1px solid rgba(255,255,255,.1);}
.lang_menu li:last-child{ border-bottom:none;}
.lang_menu a{ display:block; padding:12px 18px; color:#fff; text-align:center; transition:.3s;}
.lang_menu a:hover{ background:var(--color);}
.lang_menu{ box-shadow:0 10px 30px rgba(0,0,0,.35); border:1px solid rgba(255,255,255,.08); backdrop-filter:blur(10px);}
.lang_menu li a{ font-size:14px; font-family:ptm; white-space:nowrap;}


#w_footer { background: #000; color:#888; padding:60px 0; }
#w_footer .wrap { width: 1400px; }
#w_footer #w_gnb { position:absolute; align-items: start; left: 540px; top: 0; gap:60px; font-size:14px; }
#w_footer #w_gnb > li > a { color:#ddd; }
#w_footer #w_gnb ul { position:absolute; top: 40px; line-height:1.8; }

/* index */
#main { color:#fff; }
#main .main-swiper { width:100%; height:100vh; }
#main .swiper-slide { background-size:cover; background-position:center; background-repeat:no-repeat; }
#main .wrap { height:100vh; width: 1400px; }
#main h2 { line-height: 1.1; }
#main .main-pagination { bottom:30px; }
#main .main-pagination .swiper-pagination-bullet { width:12px; height:12px; background:#fff; opacity:0.6; }
#main .main-pagination .swiper-pagination-bullet-active { opacity:1; background:var(--color); }
#main .main-prev, #main .main-next { color:#fff; }
#main .main-prev::after, #main .main-next::after { font-size:24px; }

#latest { padding:40px 0; }
#latest h2 span { display: block; }
#latest .lat { background: none; width: 1070px; margin-bottom: 0; }
#latest .lat ul { padding:0; display:flex; flex-wrap:wrap; }
#latest .lat li { border-bottom:none; width: 50%; margin:0; padding:10px 0; display: flex; flex-direction: row-reverse; justify-content: start; align-items: center; }
#latest .lat li .lt_info { padding:0; }
#latest .lat li a { font-size:16px; font-family: ptm; font-weight: normal; }
#latest .lat li a:hover { color:#fff; }
#latest .lat li .lt_date { font-size:14px; font-family: ptm; font-weight: normal; color:#fff; width: 90px; display: block; opacity: 0.6; }
#latest .lat h2, #latest .lat .lt_more, #latest .lat .lt_info .lt_nick { display: none; }

#about ul li { width: 20%; }
#about ul figure { width: 120px; height: 120px; border-radius: 120px; background: #f1f1f1; margin:0 auto;}
#about ul i { color:#ccc; font-weight: bold; }
#about ul .on i { color: var(--color); }

#vision { background:url(/images/bg_vision.png) no-repeat center/cover; }
#vision h2 { border-bottom:2px solid var(--color); padding-bottom: 10px; display: inline-block; }
#vision ul li { flex:1; border-bottom:2px solid #fff; padding-bottom: 10px; opacity: 0.6; cursor: pointer; }
#vision ul li.on { opacity: 1; border-color:var(--color); }

#process .slide { width: 700px; }
#process .slide h2  { position: absolute; left: 40px; top: 40px; }
#process .slide h3  { position: absolute; right: 20px; bottom: 20px; }
#process .slide .bar { margin-top: 20px; gap:20px; }
#process .slide .bar > div { position:static; }
#process .slide .bar .swiper-button-prev, #process .slide .bar .swiper-button-next { font-size:20px; height:auto; margin-top: 0; width:auto; }
#process .slide .bar > div:after { font-size:20px; font-weight: bold; }
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background: var(--color); } 
#process article { width: 440px; padding-top: 70px; }
#process article p { position: absolute; right: 0; width: 440px; bottom: 80px; color:#555; }
#process .under { position: absolute; right: 0; bottom: 0; }
.under { color:#333; border-bottom:1px solid #ddd; padding-bottom: 6px; display:flex; width: 160px; }
.under i { font-size:18px; font-weight: bold; }

#process .slide .bar { margin-top:20px; display:flex; align-items:center;}
#process .slide .bar .swiper-pagination { flex:1;}
#process .slide .bar .swiper-button-prev { margin-left:auto;}



#info li { overflow: hidden; }
#info li img { transition:0.3s; }
#info li:hover img { transform: scale(1.1); }
#info .under { position: absolute; right: 0; top: 43px; }

.video { height: 660px; background: url(/images/bg_video.png) no-repeat center/cover; }

/* Video Modal */
.video-modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.85);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    z-index: 9999;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.4s ease;
}

.video-modal.show {
    display: flex;
    align-items: center; 
    justify-content: center;
    opacity: 1;
}

.video-modal .modal-content {
    position: relative;
    width: 100%;
    height: 100%;
    max-width: 100%;
    background: rgba(0,0,0,0);
    border-radius: 0;
    overflow: hidden;
    box-shadow: none;
    transform: scale(0.95);
    transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.video-modal.show .modal-content {
    transform: scale(1);
}

.video-modal .iframe-container {
    position: relative;
    width: 100%;
    height: 100%;
    padding-top: 0;
    display: flex;
    align-items: center; 
    justify-content: center;
}

.video-modal iframe {
    aspect-ratio: 16 / 9;
    max-width:1200px; 
    border: 0;
    width:85%;
}

.video-modal .modal-close {
    position: absolute;
    top: 20px;
    right: 20px;
    background: rgba(0, 0, 0, 0.5);
    border: none;
    color: #fff;
    font-size: 30px;
    cursor: pointer;
    transition: transform 0.3s ease, color 0.3s ease;
    z-index: 10000;
    outline: none;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.video-modal .modal-close:hover {
    transform: rotate(90deg);
    color: var(--color);
    background: rgba(0, 0, 0, 0.8);
}

.formmail article a { display: inline-block; }
.formmail form { width: 720px; }
.formmail form ul { flex-wrap: wrap; }
.formmail form ul li { width: 340px; margin-bottom: 24px; }
.formmail form ul li:last-child { width: 100%; }
.formmail form ul li input { height: 50px; border:none; background: #f0f0f0; width: 100%; box-sizing: border-box; padding:0 24px; font-size:18px; font-family: ptm; border-radius: 100px; }
.formmail form ul li textarea { width: 100%; background: #f0f0f0; padding:24px; box-sizing: border-box; border:none; border-radius: 25px; font-size:18px; font-family: ptm; }
.formmail form button { border:none; width: 200px; height: 50px; font-size:18px; font-family: ptm; border-radius: 50px; }
.formmail form button i { font-size:14px; position: relative; top: -1px; }


.sv { height: 390px; overflow: hidden; position: relative; }
.sv:before { content:""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; transform: scale(1.15); animation: sv 3s forwards; }

#sv1:before { background:url(/images/bg_sub1.png) no-repeat center/cover; }
#sv2:before { background:url(/images/bg_sub2.png) no-repeat center/cover; }
#sv3:before { background:url(/images/bg_sub3.png) no-repeat center/cover; }
#sv4:before { background:url(/images/bg_sub4.png) no-repeat center/cover; }
#sv5:before { background:url(/images/bg_sub5.png) no-repeat center/cover; }
#sv6:before { background:url(/images/bg_sub6.png) no-repeat center/cover; }

.sv h2 { position: relative; }

@keyframes sv {
    to{ transform: scale(1); }
}

.sm ul { display: flex; height: 55px; gap:60px; align-items: center; justify-content: center; }

/* sub1_1 */
.hover { overflow: hidden; border-radius: 14px; }
.hover img { transition:0.3s; width: 100%; }
.hover:hover img { transform: scale(1.05); }

#sub1_1 .cont1 { align-items: end; }
#sub1_1 .cont1 img {border-radius: 14px;} 
#sub1_1 .cont1 article { width: 690px; }
#sub1_1 .cont1 article p { color:#666; }

#sub1_1 .cont2 p { color:#666; }
#sub1_1 .cont2 span { display: flex; justify-content: end; color:#666; }

/* sub1_2 */
.left { width: 350px; }
.right { width: 800px; }
#sub1_2 .cont1 figure { border-radius: 20px; }
#sub1_2 .cont1 p { color:#666; }
#sub1_2 .cont1 p span {color:#a31d22;}
#sub1_2 .cont2 h2 { padding-top: 10px; border-top:1px solid var(--color); }
#sub1_2 .cont2 ul { padding-top: 14px; border-top:1px solid var(--color); }
#sub1_2 .cont2 ul li { margin-bottom: 14px; color:#666; }
#sub1_2 .cont2 ul li strong { display: inline-block; width: 100px; color:#000; }
#sub1_2 .cont2 ul li span {margin-left: 100px;}

#sub1_2 .cont3 { position: relative;background: url(/images/bg_ruddud.png) no-repeat center/cover;overflow: hidden;}
#sub1_2 .cont3::before {content:'';position:absolute;inset:0;background:rgba(0,0,0,0.45);}
#sub1_2 .cont3 .wrap {position:relative;z-index:2;}
#sub1_2 .cont3 ul {justify-content:center;gap:40px;}
#sub1_2 .cont3 ul li {width:350px;height:350px;border-radius:50%;background:rgba(168, 18, 18, 0.72);backdrop-filter: blur(3px);display:flex;flex-direction:column;justify-content:center;align-items:center;
    text-align:center;padding:40px;box-sizing:border-box;border:1px solid rgba(255,255,255,0.15);transition:0.3s;}
#sub1_2 .cont3 ul li:hover {transform:translateY(-10px);background:rgba(190, 20, 20, 0.82);}
#sub1_2 .cont3 h3 {font-size:42px;font-weight:700; margin-bottom:30px; color:#fff;}
#sub1_2 .cont3 p {color:#fff;line-height:1.9; font-size:17px; word-break:keep-all;}
#sub1_2 .cont3_2 p  {line-height: 1.4;}

#sub1_2 .cont4 h2{color:#a31d22;}
#sub1_2 .cont4 ul li { width:210px; line-height:50px; border:1px solid #fff; border-radius: 100px; }
#sub1_2 .cont4 ul li.op0 { visibility:hidden; }
#sub1_2 .cont4 ul li.op1 { background:rgba(255,255,255,0.1); }
#sub1_2 .cont4 img {width:100%;}
#sub1_2 .cont4 img.mob {width:100%;height:auto;display:block;}

/* sub1_3 */
#sub1_3 .cont1 ul.addr li { margin-bottom: 10px; color:#666; }
#sub1_3 .cont1 ul.addr li strong { display: inline-block; width: 100px; color:#000; }
#sub1_3 .cont1 ul.addr li span {margin-left: 100px;}

#sub1_3 .cont1 ul.comp { flex-wrap:wrap; }
#sub1_3 .cont1 ul.comp li { width: 380px; margin-bottom: 50px; }
#sub1_3 .cont1 ul.comp li p { margin-top: 10px; color:#666; }

/* sub1_4 */
#sub1_4 ul { flex-wrap:wrap; }
#sub1_4 ul li { width: 380px; border:1px solid #ddd; border-radius: 12px; min-height:110px; display: flex; align-items: center; justify-content: center; margin-bottom: 30px; }

/* sub2_1 */
.prdList ul { flex-wrap:wrap; justify-content: start; }
.prdList ul li { width: 285px; margin-bottom: 40px; margin-right: 20px;  }
.prdList ul li:nth-child(4n) { margin-right: 0; }
.prdList ul li figure { width: 100%; height: 380px; border-radius: 14px; border:1px solid #e3e3e3; background: #fff; display: flex; align-items: center; justify-content: center; }
.prdList ul li figure:hover {border-color:#7c7c7c;}
.prdList ul li figure img { max-width:80%; width:auto; }
.prdList ul li p { margin-top: 10px;  text-align: center; }


/* sub2_2 */
.prdList_2 ul { flex-wrap:wrap; justify-content: start }
.prdList_2 ul li { width: 585px; margin-bottom: 40px; margin-right: 30px;  }
.prdList_2 ul li:nth-child(2n) { margin-right: 0; }
.prdList_2 ul li figure { width: 100%; height: 585px; border-radius: 14px; border:1px solid #e3e3e3; background: #fff; display: flex; align-items: center; justify-content: center; }
.prdList_2 ul li figure:hover {border-color:#7c7c7c;}
.prdList_2 ul li figure img { max-width:80%; width:auto; }
.prdList ul li p { margin-top: 10px;  text-align: center; }


/* sub2_3 */
.prdList_3 ul { flex-wrap:wrap; justify-content: space-between;}
.prdList_3 ul li { width: 380px; margin-bottom: 40px;}
.prdList_3 ul li:nth-child(3n) { margin-right: 0; }
.prdList_3 ul li figure { width: 100%; height: 280px; }
.prdList_3 ul li figure:hover {border-color:#e3e3e3;}

/* detail */
.detail .cont1 h2 a:hover {border-bottom: 2px solid #000;  transition:0.3s;}
.detail .cont1 h2 span { margin-left: 40px; }
.detail .thumb { position: relative; }
.detail .thumb figure { position: relative; width: 789px; }
.detail .thumb figure img {border-radius: 24px;}
.detail .thumb figure span { width: 30px; height: 30px; text-align: center; line-height: 30px; border-radius: 24px; position: absolute;  }
.detail .thumb .ment { position: absolute; right: 0; top: 0; width: 380px; height: 320px; padding:30px 20px; box-sizing: border-box; background: #f4f4f4; border-radius: 14px; }
.detail .thumb .ment p { color:#666; }
.detail .thumb .part { position: absolute; right: 0; bottom: 0; width: 380px; height: 315px; border-radius: 14px; background: #f4f4f4; display: flex; align-items: center; justify-content: center; }
.detail .thumb .part img { mix-blend-mode: multiply; }



.detail .cont2 { padding-left: 240px; position: relative; }
.detail .cont2 strong { position: absolute; left: 0; }
.detail .cont2 p { color:#666; }
.detail_2 .cont2 { padding-left: 0px; position: relative; }


.detail .thumb figure span { cursor: pointer; }



#sub2_1_1 .thumb2_1_1 figure span:nth-of-type(1) { left: 80%; top: 45%; }
#sub2_1_1 .thumb2_1_1 figure span:nth-of-type(2) { left: 30%; top: 50%; }
#sub2_1_1 .thumb2_1_2 figure span:nth-of-type(1) { left: 85%; top: 45%; }
#sub2_1_1 .thumb2_1_2 figure span:nth-of-type(2) { left: 55%; top: 50%; }
#sub2_1_1 .thumb2_1_2 figure span:nth-of-type(3) { left: 15%; top: 60%; }
#sub2_1_1 .thumb2_1_3 figure span:nth-of-type(1) { left: 25%; top: 65%; }
#sub2_1_1 .thumb2_1_3 figure span:nth-of-type(2) { left: 65%; top: 10%; }
#sub2_1_1 .thumb2_1_4 figure span:nth-of-type(1) { left: 85%; top: 45%; }
#sub2_1_1 .thumb2_1_4 figure span:nth-of-type(2) { left: 50%; top: 45%; }
#sub2_1_1 .thumb2_1_4 figure span:nth-of-type(3) { left: 28%; top: 60%; }
#sub2_1_1 .thumb2_1_5 figure span:nth-of-type(1) { left: 65%; top: 70%; }
#sub2_1_1 .thumb2_1_5 figure span:nth-of-type(2) { left: 65%; top: 25%; }
#sub2_1_1 .thumb2_1_6 figure span:nth-of-type(1) { left: 75%; top: 60%; }
#sub2_1_1 .thumb2_1_7 figure span:nth-of-type(1) { left: 75%; top: 60%; }


#sub2_1_1 .thumb2_2_2 figure span:nth-of-type(1) { left: 40%; top: 30%; }
#sub2_1_1 .thumb2_2_2 figure span:nth-of-type(2) { left: 45%; top: 35%; }
#sub2_1_1 .thumb2_2_2 figure span:nth-of-type(3) { left: 45%; top: 70%; }
#sub2_1_1 .thumb2_2_2 figure span:nth-of-type(4) { left: 50%; top: 73%; }
#sub2_1_1 .thumb2_2_2 figure span:nth-of-type(5) { left: 67%; top: 70%; }
#sub2_1_1 .thumb2_2_2 figure span:nth-of-type(6) { left: 70%; top: 67%; }

#sub2_1_1 .thumb2_2_7 figure span:nth-of-type(1) { left: 42%; top: 65%; }
#sub2_1_1 .thumb2_2_7 figure span:nth-of-type(2) { left: 47%; top: 67%; }
#sub2_1_1 .thumb2_2_7 figure span:nth-of-type(3) { left: 44%; top: 70%; }


/* sub3_1 */
.listModal { position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.8); align-items: center; justify-content: center; z-index: 99; display: none; }
.listModal.on { display: flex; }
.listModal > div { display: none; width: 1140px; background: #fff; padding:40px; gap:40px; }
.listModal > div.on { display: flex; }
.listModal figure { flex:1; }
.listModal article { flex:1; }
.listModal article p { word-break:keep-all; font-family:ptr; }

#sub3_1 .cont3 ul { margin-left: 50px; align-items: start; justify-content: space-between; }
#sub3_1 .cont3 ul li { width: 120px; text-align: center; cursor:pointer; }
#sub3_1 .cont3 ul li figure { width: 100%; aspect-ratio:1 / 1; border:1px solid var(--color); box-sizing:border-box; border-radius:200px; background: #fff; position: relative; transition:0.3s; }
#sub3_1 .cont3 ul li figure img { transition:0.3s; }
#sub3_1 .cont3 ul li dt { display: block; margin-top: 20px; }
#sub3_1 .cont3 ul li dd { margin-top: 0px; font:20px steb; white-space:nowrap; }
#sub3_1 .cont3 .top { width: 930px; }
#sub3_1 .cont3 .bot { margin-top: 50px; flex-direction:row-reverse; width: 778px;  }
#sub3_1 .cont3 .bot li { margin-left: 120px; }
#sub3_1 .cont3 ul li figure.cb { background: var(--color); }
#sub3_1 .cont3 ul li figure.cb img { filter:invert(1); }

#sub3_1 .cont3 ul li figure:before { content:""; width: 150px; border-top:1px dashed var(--color); position: absolute; left: 100%; top:50%; }
#sub3_1 .cont3 ul li figure:after { content:"\e93e"; font-family:xeicon; color:#a31d22; font-weight:bold; font-size:20px; top:50%; transform:translatey(-50%); left:calc(100% + 55px); position: absolute; }
#sub3_1 .cont3 .bot li figure:after { content:"\e93b"; }

#sub3_1 .cont3 .top li:nth-child(4) figure:before { width: 130px; height: 245px; border-right:1px dashed #a31d22; border-bottom:1px dashed #a31d22;  }
#sub3_1 .cont3_2 .top li:nth-child(4) figure:before { height: 295px; }

/* ------------------------------
   제조공정 슬라이드
------------------------------*/
#sub3_1 .wrap_2 {width: 1000px;}
#sub3_1 .procSlide{ position:relative;  margin-top:90px; align-items:center; justify-content:center;}
#sub3_1 .procBox{ width:100%; max-width:1140px;}
#sub3_1 .procBox>div{ display:none; align-items:center; gap:60px; padding:40px; background:#fff; border:1px solid #ddd; border-radius:20px; box-sizing:border-box;}
#sub3_1 .procBox>div.on{ display:flex;}
#sub3_1 .procBox figure{ width:40%; flex-shrink:0;}
#sub3_1 .procBox figure img{ width:100%; display:block; border-radius:8px;}
#sub3_1 .procBox article{ flex:1;}
#sub3_1 .procBox article span{ display:block; color:var(--color);}
#sub3_1 .procBox article h3{ margin-top:10px; color:#222;}
#sub3_1 .procBox article p{ margin-top:10px; line-height:1.8; color:#666; word-break:keep-all;}
#sub3_1 .procSlide button{ position:absolute; top:50%; transform:translateY(-50%); width:50px; height:50px; border:0; background:none; font-size:42px; color:var(--color); cursor:pointer; z-index:10;}
#sub3_1 .procSlide .prev{ left:-70px;}
#sub3_1 .procSlide .next{ right:-70px;}




/* sub3_2 */

#sub3_2 .cont2 .hover { position: relative; }
#sub3_2 .cont2 .hover article { position: absolute; left: 30px; bottom: 40px; }
#sub3_2 .cont2 .hover article ul { color:#d5bcbc; }

/* sub4_1 */
#sub4_1 h2 { padding-bottom: 20px; border-bottom:1px solid #a31d22; }
#sub4_1 .cont1 .list > li { padding:40px 0; border-bottom:1px solid #ddd; display: flex; align-items: start; justify-content:space-between; }
#sub4_1 .cont1 .list > li figure { width: 550px; height: 420px; border-radius:10px; background: #fff; margin:0; }
#sub4_1 .cont1 .list > li figure img { max-width: 80%; max-height: 90%; }
#sub4_1 .cont1 .list > li article { width: 600px; }
#sub4_1 .cont1 .list > li article p { margin-top: 20px; }
#sub4_1 .cont1 .list > li article ul { margin-top: 60px; border-top:1px solid #ddd; }
#sub4_1 .cont1 .list > li article ul li { line-height:46px; border-bottom:1px solid #ddd; }
#sub4_1 .cont1 .list > li article ul li strong { display: inline-block; width: 220px; font-family:steb; }
#sub4_1 .cont1_2 .list > li article ul li strong {font-family:'Noto Sans JP', sans-serif; font-weight: 700;}
#sub4_1 .cont1 .list > li article ul li span {margin-left: 225px;}

/* sub4_2 */
#sub4_2 .cont1 ul { flex-wrap:wrap; }
#sub4_2 .cont1 ul li {margin-bottom: 60px;  }
#sub4_2 .cont1 ul li figure { width: 550px; height: 550px; border:1px solid #e3e3e3; background: #fff; border-radius: 14px; overflow: hidden; display: flex; align-items: center; justify-content: center; }
#sub4_2 .cont1 ul li figure img { max-width:100%; mix-blend-mode: multiply; }
#sub4_2 .cont1 ul li p { margin-top: 10px; text-align: center; }
#sub4_2 .cont1 ul li span { margin-top: 10px; display: block; }

/* sub4_3 */
#sub4_3 h2 { padding-bottom: 20px; border-bottom:1px solid #a31d22; }
#sub4_3 .cont1 .list > li { padding:40px 0; border-bottom:1px solid #ddd; display: flex; align-items: start; justify-content:space-between; }
#sub4_3 .cont1 .list > li:last-child {border-bottom:none;}
#sub4_3 .cont1 .list > li figure { width: 550px; height: 420px; border-radius:10px; background: #fff; margin:0; }
#sub4_3 .cont1 .list > li figure img { max-width: 100%; max-height: 100%; }
#sub4_3 .cont1 .list > li article { width: 600px; }
#sub4_3 .cont1 .list > li article p { margin-top: 20px; }
#sub4_3 .cont1 .list > li article ul { margin-top: 60px; border-top:1px solid #ddd; }
#sub4_3 .cont1 .list > li article ul li { line-height:46px; border-bottom:1px solid #ddd; }
#sub4_3 .cont1 .list > li article ul li strong { display: inline-block; width: 220px; font-family:steb; }
#sub4_3 .cont1_2 .list > li article ul li strong {font-family:'Noto Sans JP', sans-serif; font-weight: 700;}
#sub4_3 .cont1 .list > li article ul li span {margin-left: 225px;}

#sub4_3 .cont2 ul { flex-wrap:wrap; justify-content: start; }
#sub4_3 .cont2 ul li { width:350px; margin-bottom: 60px; margin-right: 75px; }
#sub4_3 .cont2 ul li:nth-child(3n) { margin-right: 0; }
#sub4_3 .cont2 ul li figure { border:1px solid #e3e3e3; background: #fff; border-radius: 14px; overflow: hidden; display: flex; align-items: center; justify-content: center; }
#sub4_3 .cont2 ul li figure img { max-width:80%; mix-blend-mode: multiply; }
#sub4_3 .cont2 ul li p { margin-top: 10px; text-align: center;}
#sub4_3 .cont2 ul li span { margin-top: 10px; display: block; }

/* sub5_1 */
#sub5_1 .cont2 p { width: 790px; }
#sub5_1 .cont3 li { border:1px solid var(--color); width: 350px; height: 350px; border-radius: 350px; gap:40px; }
#sub5_1 .cont4 { background: url(/images/goal.png) no-repeat center/cover; }
#sub5_1 .cont4 ul li { justify-content: start; margin-bottom: 60px;  color:#000; padding-bottom: 10px; border-bottom:1px solid #a31d22;}
#sub5_1 .cont4 ul li:last-child { margin-bottom: 0; }
#sub5_1 .cont4 ul li span { width: 200px; }
#sub5_1 .cont4 ul { width: 700px;}

/* sub5_2 */
#sub5_2 .prc div {width: 210px;height: 210px;border:1px solid var(--color); border-radius: 210px; cursor: pointer; position: relative; display:flex; flex-direction:column; justify-content:center;align-items:center; transition:0.3s; }
#sub5_2 .prc div span { position:absolute;top:35px; left:50%; transform:translateX(-50%);}
#sub5_2 .prc div p {margin-top: 0; transform: translateY(12px);}

#sub5_2 .cont2 { border-top:1px solid var(--color); padding-top: 20px; display: none; }
#sub5_2 .cont2.on { display: block; }
#sub5_2 .cont2 p { padding-left: 50px; margin-top: 20px; padding-bottom: 80px; border-bottom:1px solid #ddd; }

#sub5_2 .cont2 .img_wrap{display:flex !important;gap:70px;}
#sub5_2 .cont2 .img_wrap figure{ flex:0 0 calc(50% - 15px) !important; max-width:calc(50% - 15px) !important; width:calc(50% - 15px) !important;margin:0 !important;}
#sub5_2 .cont2 .img_wrap img{ width:100%;display:block;}

/* sub5_3 */
#sub5_3 .cont1 h3 { padding-top: 10px; }
#sub5_3 .cont1 figure { margin-top: 10px; width:400px;  height:500px;  display:flex;  align-items:center;  justify-content:center;}
#sub5_3 .cont1 figure img{ max-width:100%; max-height:500px; width:auto;  height:auto; display:block;}
#sub5_3 .cont1 div { border-top:1px solid var(--color); }
#sub5_3 .cont1 ul { width: 450px; line-height:50px;  }
#sub5_3 .cont1 ul li { display: flex; align-items: center; justify-content: space-between; border-bottom:1px solid #ddd; cursor:pointer;}
#sub5_3 ul li.on{ color:var(--color); font-weight:600;}
#sub5_3 .cont1 ul li:hover { color:var(--color); }
#sub5_3 .cont1 ul li a { font-size:20px; color:var(--color); }
#sub5_3 .cont1 ul li p {font-size:20px;}

#sub5_3 .cont2 ul { gap:10px; }
#sub5_3 .cont2 ul li { position: relative; }
#sub5_3 .cont2 ul li.on:before { content:""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; box-sizing:border-box; border:3px solid var(--color); }
#sub5_3 .cont2 ul li img { width: 100%; }

/* sub6_1 */
#sub6_1 .tbl_wrap table { border-top-color:var(--color); }