/* scroll */
::-webkit-scrollbar { width:5px; height: 5px; }
::-webkit-scrollbar-track { background:#eee; -moz-border-radius:0; -webkit-border-radius:0; border-radius:0; }
::-webkit-scrollbar-thumb { height:50px; width:50px; background:#000; -moz-border-radius:0px; -webkit-border-radius:0px; border-radius:0px; }
::-webkit-scrollbar-thumb:window-inactive { background:#000; -moz-border-radius:0px; -webkit-border-radius:0px; border-radius:0px; }

.scroll_on { opacity: 0; transition: all 1s;}
.scroll_on.active {opacity: 1 !important;transform: translate(0, 0) !important;}
.scroll_on.type_top {transform: translate(0, -50px);}
.scroll_on.type_bottom {transform: translate(0, 50px);}
.scroll_on.type_left {transform: translate(-50px, 0);}
.scroll_on.type_right {transform: translate(50px, 0);}

.scroll_on02 { opacity: 0; transition: all 1s;}
.scroll_on02.active {opacity: 1 !important; }

.wrap { position: relative; width: 1440px; margin: 0 auto; }
.product_wrap { position: relative; width: 90%; margin: 0 auto; }

/* head */
.head {
    position: relative;
    left: 0;
    top: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    width: 100%;
    z-index: 9;
    background: #fff;
}

.head .head_inr01 { display: flex; flex-wrap: wrap; align-items: center; width: 100%; height: 50px; background: #000; }
.head_inr01 .wrap { display: flex; flex-wrap: wrap; justify-content: flex-end; }
.head_topmenu {  }
.head_topmenu:after { content: ""; display: block; clear: both; }
.head_topmenu li { position: relative; float: left; display: inline-flex; justify-content: center; align-items: center; padding: 0 20px; }
.head_topmenu li:last-child { padding-right: 0px; }
.head_topmenu li:after { content:''; position: absolute; right: 0px; top: 40%; width: 3px; height: 3px; border-radius: 3px; background: rgba(255, 255, 255, 0.5); }
.head_topmenu li:last-child:after { display: none; }
.head_topmenu li a { display: inline-block; color: rgba(255, 255, 255, 1); font-size: 14px; font-weight: 400; }
.head_topmenu li a:hover { color: rgba(255, 255, 255, 1); }

.head .head_inr02 { display: flex; flex-wrap: wrap; align-content: center; justify-content: space-between; align-items: center; height: 100px; }
.logo {  }
.logo a { }
.menu { position: relative; display: inline-flex; justify-content: center; align-items: center; }
.menu_innner { display: flex; flex-wrap: wrap; align-items: center; gap: 0 60px; }
.menu_innner li { position: relative; display: inline-flex; justify-content: center; align-items: center; }
.menu_innner li a { position: relative; color: #222; font-size: 20px; font-weight: 700; text-transform: uppercase; }
.menu_innner li a i { font-size: 27px; font-weight: normal; font-style: normal; }

.menu-toggler, .mobile_menu { display: none; }

/* footer */
.footer { padding: 50px 0; background:#000; }
.ft_logo { margin-bottom: 30px; }
.footer_menu { position: absolute; top: 0px; right: 0; z-index: 9; display: flex; flex-direction: column; flex-wrap: wrap; gap: 10px; }
.footer_menu li { text-align: right; }
.footer_menu li a { display: inline-flex; flex-wrap: wrap; align-content: center; justify-content: center; align-items: center; color: #fff; font-weight: 300; }
.footer_menu li a:hover { text-decoration: underline; }

.footer_copyright { position: relative; color: #fff; font-family: 'Pretendard'; font-weight: 300; line-height: 1.7; }
.footer_copyright span { position: relative; display: inline-block; padding: 0 15px; }
.footer_copyright span:after { content:''; position: absolute; right: 0px; top: 25%; width: 1px; height: 50%; background: #666; }
.footer_copyright span.noline:after { display: none; }
.footer_copyright span.pl00 { padding-left: 0px; }
.footer_copyright p { margin-top: 20px; color: rgba(255, 255, 255, 0.6); }

/* main */
.main_vis { position: relative; width: 100%; height: 600px; background: url('../image/main/main_vis01.jpg') center center no-repeat; background-size: cover; }
.main_text { display: flex; flex-wrap: wrap; align-content: center; justify-content: center; align-items: center; width: 100%; height: 100%; color: #fff; animation: fadein 1s ease-in-out; }
.main_text .stitle { margin-bottom: 50px; text-align: center; width: 100%; font-size: 18px; font-family: 'athelas'; text-transform: uppercase; }
.main_text .stitle i { font-size: 24px; }
.main_text h2 { width: 100%; margin-bottom: 50px; font-size: 75px; font-weight: 800; line-height:1; }
.main_text p { width: 100%; margin-bottom: 50px; font-size: 32px; line-height: 1.5; word-break: keep-all; }
.main_text p strong { font-weight: 800; }
.main_vis_more { display: inline-flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 10px; width: 260px; height: 70px; background: #fee500; border-radius: 5px; color: #2f363e; font-size: 20px; font-weight: 700; }
.main_vis_more i { margin-left: 20px; }

@keyframes fadein{
	0% { opacity: 0; transform: translateY(100px); }
	100% { opacity: 1; transform: none; }
}

.main_con { display: flex; flex-wrap: wrap; padding: 100px 0; }
.main_con h2 { text-align: center; margin-bottom: 50px; font-size: 36px; font-weight: 800; }

.main_con02 { background: #f0f2f5; }

/* sub */
.sub_vis { position: relative; display: flex; flex-direction: column; flex-wrap: wrap; justify-content: center; align-items: center; text-align: center;  width: 100%; height: 300px; background: url('../image/main/main_vis01.jpg') center center no-repeat; background-size: cover; }

.sub_text { position: relative; z-index: 9; display: flex; flex-wrap: wrap; align-content: center; justify-content: center; align-items: center; text-align: center; width: 100%; height: 100%; color: #fff; animation: fadein 1s ease-in-out; }
.sub_text h2 { width: 100%; margin-bottom: 50px; font-size: 82px; line-height:1; }
.sub_text h2 img { max-width: 100%; }
.sub_text p { width: 100%; margin-bottom: 80px; font-size: 1.3em; line-height: 1.5; }

.pcver { display: block; }
.tbl_wrap table.pcver { display: table; }

.mobilever { display: none; }

#sub_contents { margin: 0px auto; }
#sub_contents.wrap { margin: 80px auto; }

.sub_title { position: relative; }
.sub_title span { display: block; margin-bottom: 20px; color: rgba(255, 255, 255, 0.7); font-size: 1.15em; font-weight: 600; }
.sub_title h2 { color: #fff; font-size: 52px; font-weight: 800; text-transform: uppercase; line-height: 1; }

.provision p, .privacy p { margin-bottom: 30px; }

.sub_inr { /* padding-bottom: 100px; */ }
.sub_inr_last { padding-bottom: 0px; }
.sub_inr01 { display: flex; flex-wrap: wrap; }

.sub_inr_left, .sub_inr_right { position: relative; width: 50%; }
.sub_inr01 .sub_inr_left { display: flex; flex-wrap: wrap; justify-content: flex-start; height: 100vh; padding: 120px 0; }
.sub_inr_img01 { width: 100%; height: 100%; background: url('../image/sub/about_img01.png') center center no-repeat; background-size: cover; }
.sub_inr_img01.active { width: 100%; }

.sub_inr01 .sub_inr_right { display: flex; flex-wrap: wrap; justify-content: flex-start; align-content: center; align-items: center; padding-left: 80px; }
.sub_inr_textbox { width: 720px; }
.sub_inr_title { margin-bottom: 50px; width: 100%; }
.sub_inr_title img { max-width: 100%; }
.sub_inr_text .title { margin-bottom: 50px; font-family: 'athelas'; font-size: 58px; line-height: 1.2; word-break: keep-all; }
.sub_inr_text p { color: #555; font-size: 1.3em; line-height: 1.7; word-break: keep-all; }
.sub_inr_text p strong { font-size: 1.1em; font-family: 'athelas'; font-weight: normal; }

.about .sub_inr02 { position: relative; display: flex; flex-direction: column; flex-wrap: wrap; justify-content: center; align-items: center; height:100vh; background: url('../image/sub/sub_brand01_bg02.jpg') center center no-repeat; background-size: cover; background-attachment: fixed; }
.about .sub_inr02:after { content:''; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.4); }
.about .sub_inr02 .wrap { z-index: 9; }
.about .sub_inr02 h3 { text-align: center; margin: 0px 0 50px; color: #fff; font-family: 'athelas'; font-size: 58px; }
.about .sub_inr02 p { text-align: center; color: rgba(255, 255, 255, 0.8); font-size: 1.3em; font-weight: 300; line-height: 1.5; word-break: keep-all; }
.about .sub_inr02 p strong { font-weight: 600; }

.about .sub_inr03 { padding: 120px 0; }
.about .sub_inr03 h3 { text-align: center; margin: 0px 0 50px; font-family: 'athelas'; font-size: 58px; }
.about .sub_inr03 h3 strong { color: #fa5d30; font-weight: 600; }
.about .sub_inr03 p { text-align: center; margin-bottom: 80px; color: #555; font-size: 1.3em; font-weight: 300; line-height: 1.5; word-break: keep-all; }
.about .sub_inr03 p strong { font-weight: 600; }

.about .sub_inr03 .about_inr03_inr { display: flex; flex-wrap: wrap; text-align: left; margin-bottom: 120px; }
.about .sub_inr03 .about_inr03_inr02 { flex-direction: row-reverse; }
.about .sub_inr03 .about_inr03_inr:last-child { margin-bottom: 0px; }
.about .sub_inr03 .about_inr03_imgbox { width: 50%; }
.about .sub_inr03 .about_inr03_textbox { display: flex; flex-wrap: wrap; align-content: center; width: 50%; }
.about .sub_inr03 .about_inr03_inr01 .about_inr03_textbox { padding-left: 80px; }
.about .sub_inr03 .about_inr03_inr02 .about_inr03_textbox { padding-right: 80px; }

.about .sub_inr03 .about_inr03_textbox h4 { margin: 0px 0 30px; font-family: 'athelas'; font-size: 58px; }
.about .sub_inr03 .about_inr03_textbox p { text-align: left; margin-bottom: 0px; font-size: 1.15em; }

.about_inr03_img { width: 100%; height: 550px; }
.about_inr03_img01 { background: url('../image/sub/about_img02.png') center center no-repeat; background-size: cover; }
.about_inr03_img02 { background: url('../image/sub/about_img03.png') center center no-repeat; background-size: cover; }

.about { text-align: center; }
.about img, .b2b img { max-width: 100%; }

/* shop */

#sct_hhtml img { max-width: 100%; }

.personal_code { display: flex; flex-wrap: wrap; }
.personal_code dt, .personal_code dd { display: flex; flex-wrap: wrap; align-items: center; line-height: normal; }
.personal_code dt { margin-right: 10px; font-weight: 500; }
.personal_code dd a { display: flex; align-items: center; padding: 0 15px; border: 0; border-radius: 0px; height: 45px; background: #61666d; color: #fff; font-size: 0.9em; }
.personal_code dd.personal_code_link { margin-left: 5px; }
.personal_code_choice { margin-top: 10px; line-height: normal; }

#sit_inf_explan iframe { width: 100%; }

.sod_list_new li.sod_list_new_inr { display: flex; flex-wrap: wrap; margin-bottom: 15px; padding: 20px 10px 10px; background: #fff; border: 1px solid #d9dde3; }
.sod_list_new .li_prqty { width: 100%; }
.sod_list_new .li_prqty dl { display: flex; flex-wrap: wrap; margin-bottom: 5px; padding: 15px 20px; background: #f7f7f7; }
.sod_list_new .li_prqty dl dd { position: relative; width: 25%; padding: 0 15px; }
.sod_list_new .li_prqty dl dd:after { content:''; position: absolute; left: 0px; top: 0px; width: 1px; height: 100%; background: #ccc; }
.sod_list_new .li_prqty dl dd:first-child:after { display: none; }
.sod_list_new .li_prqty dl dd span { display: flex; flex-wrap: wrap; justify-content: space-between; }
.sod_list_new .li_prqty dl dd span i { margin-right: 20px; font-style: normal; font-weight: 500; }
.sod_list_new .li_prqty .total_pricebox { display: flex; flex-wrap: wrap; justify-content: space-between; width: 100%; padding: 15px 35px; background: #e0f0f3; }
.sod_list_new .li_prqty .total_pricebox i { font-style: normal; font-weight: 500; }
.sod_list_new .li_prqty .total_pricebox .total_price { font-weight: 700; }