@charset "UTF-8";
/* CSS Document */

body { color:var(--ol-ui-text); }
a {	color:var(--ol-aquateal); }
a:hover { color:var(--ol-aquateal); }
a.active { color:var(--ol-aquateal); }
a:focus { color:var(--ol-aquateal); }
:root {
    --ol-ui-text: #808080;
    /* --ol-aquateal: #5BC5BF; */
    --ol-aquateal: #359792;
    --ol-lightblue-w53: #3694D1;
    --ol-background: #FAF8F5;
}

* { transition:gap 300ms;}

.h1, h1, .h2, h2 { font-weight:900; /* display:inline-block; */ color:var(--ol-ui-gray); }
.h3, h3 { font-weight:900; /* display:inline-block; */ color:var(--ol-ui-gray); margin-bottom:2rem; }
.h4, h4 { font-weight:900; /* display:inline-block; */ color:var(--ol-ui-gray); margin-bottom:2rem; }

.hdr-gradient {
	background:unset; -webkit-background-clip:unset; -webkit-text-fill-color:unset;
}

.btn.general { background-color:var(--ol-aquateal); border-radius:2rem; font-size:1.25rem; font-weight:bold; }
.btn.general:hover { filter:brightness(1.1); }
.btn.general.large { font-size:1.75rem; }

.card-icon { position:absolute; right:1em; top:0; transform:translateY(-50%); }
.card-icon::before { position:relative; content:""; background-image: url('../img/icon-checklist.svg'); width:54px; height:49px; display:block; }




.dropdown-item.active, .dropdown-item:active { background-color:var(--ol-aquateal); }

.navbar-brand { display:flex; align-items:center; font-size:1em; font-weight:bold; }
.navbar-brand-name { margin-left:.5em; }

.navbar-contents { font-size:1rem; }

.nav-item .dropdown-menu { font-size:1rem; }

.navbar-light .nav-item.active .nav-link,
.navbar-light .nav-item .nav-link.active,
.navbar-light .nav-item:focus .nav-link,
.navbar-light .nav-item:hover .nav-link {
	color: var(--ol-aquateal);
}

.site-main .h2 { color:var(--ol-ui-gray); display:inline-block; }
.decoline::after { background-color:var(--ol-aquateal); }
.hdr .decoline::after { top:1.2em; }




.widget-billboard.art-hero > .text { font-size:65px; line-height:1em; }
.widget-billboard.art-hero > .text h1, .widget-billboard.art-hero > .text h2 { font-size:65px; line-height:1em; text-align:left; color:black; }
.widget-billboard.art-hero > .text img { position:relative; top:unset; left:unset; width:auto; height:auto; object-fit:unset; object-position:unset; }
.widget-billboard.art-hero > .text > .container { width:fit-content; }

.widget-billboard.art-hero .art_title { margin-bottom:24px; }
.widget-billboard.art-hero .art_title h1 { display:inline; }




.widget-trusted { background-color:var(--ol-background); }

.trusted-wrapper { padding:6rem 0 !important; position:relative; display:flex; flex-direction:column; align-items:center; }

.trusted-cards { display:flex; flex-direction:row; gap:3rem; flex-wrap:wrap; justify-content:space-between; }
.trusted-cards .card { width:calc(25% - 1.5em); }
.trusted-cards .card-body { padding:4rem 2.25rem; }
.trusted-cards .card-title { text-align:center; margin-bottom:1rem; }
.trusted-cards .card-icon-hero { width:80%; max-width:200px; }
.trusted-cards .card-text { font-size:1.5rem; line-height:1.3em; }




.widget-lineup { background-color:var(--ol-lightgray2); }

.lineup-wrapper { padding:6rem 0 !important; }

.lineup-cards { margin-top:2em; display:flex; gap:2em; justify-content:space-between; }
.lineup-cards .card { width:fit-content; background:unset; border:0; /* align-items:center; */ }
.lineup-cards .card-img { position:relative; width:fit-content; }
.lineup-cards .card-img img { aspect-ratio:434/148; }
.lineup-cards .card-badge { position:absolute; right:0; top:0; transform:translateX(50%) translateY(-50%); width:19%; background-color:var(--ol-aquateal); border-radius:100%; display:flex; justify-content:center; align-items:center; color:white; font-size:2.25rem; font-weight:bold; letter-spacing:-1px; padding:0; aspect-ratio:1/1; container-type:inline-size; }
.lineup-cards .card-badge.w53 { background-color:var(--ol-lightblue-w53); }
.lineup-cards .card-badge span { font-size:37cqw; }
.lineup-cards .card-body { padding-left:0; padding-right:0; }
.lineup-cards .card-title { margin-bottom:.5em; }




.widget-socialmedia { background-color:var(--ol-background); }

.socialmedia-wrapper { padding:6rem 0 !important; position:relative; display:flex; flex-direction:column; align-items:center; }

.socialmedia-plugin-wrapper { width:100%; max-width:1590px; }
.socialmedia-plugin { width:100%; }
.socialmedia-plugin .post { border-radius:0 !important; }




.widget-aboutus_intro { position:relative; }
.widget-aboutus_intro .hdr { margin-bottom:4.5em; }

.textgrid { display:flex; }
.textgrid-left { flex:0 1 50%; padding-right:3.875rem; }
.textgrid-right { flex:1; }
.textgrid-text-container + .textgrid-text-container { margin-top:3.5em; }
.textgrid-text-container h2 { margin-bottom:.535em; }
.textgrid-img-container { position:absolute; left:unset; right:0; top:0; bottom:0; width:50%; }
.textgrid-right .textgrid-img-body { object-fit:cover; object-position: left bottom; width:100%; height:80%; aspect-ratio:1/1; }

.img-iso4074 { margin-bottom:1em; aspect-ratio:226/43; }




.widget-aboutus_karex { position:relative; }

.widget-aboutus_karex a:hover { text-decoration:underline; }
.widget-aboutus_karex .img-body { object-fit:cover; aspect-ratio:1920/750; width:100%; }
.widget-aboutus_karex .hdr { text-align:center; display:block; margin-left:auto; margin-right:auto; }



.widget-product_hero { aspect-ratio:1920/1005; max-height:1005px; }
.hero-contents { text-align:center; padding:0; height:100%; }
.hero-hdr { display:flex; justify-content:center; align-items:center; height:100%; }
.hero-hdr h1 { font-weight:300; }
.hero-hdr h1 strong { font-weight:900; }

.condom_d56 .widget-product_hero { background-image:url('../img/contents/products/condom/bg-d56_md.jpg'); background-position:center bottom; }
.condom_w53 .widget-product_hero { background-image:url('../img/contents/products/condom/bg-w53_md.jpg'); }
@supports ( background-image:url('../img/contents/products/condom/bg-w53.webp')) {
    .condom_d56 .widget-product_hero { background-image:url('../img/contents/products/condom/bg-d56_md.webp'); }
	.condom_w53 .widget-product_hero { background-image:url('../img/contents/products/condom/bg-w53_md.webp'); }
}

.desc-contents { padding-top:7rem; padding-bottom:7rem; }

.descgrid { display:flex; flex-wrap:wrap; column-gap:2em; }
.descgrid-text { flex:1; }
.descgrid-text .hdr { margin-bottom:0; }
.descgrid-spec { flex:0 1 36%; }
.descgrid-img { flex:100%; display:flex; justify-content:center; padding-top:2em; }

.descgrid .hero-spec-front { border:3px solid var(--ol-lightgray2); border-radius:1em; color:var(--ol-ui-gray); }
.descgrid .hero-spec-usp-lists li { filter:saturate(0); }
.descgrid .hero-spec-data-box { border-left-color:var(--ol-aquateal); }
.condom_w53 .descgrid .hero-spec-data-box { border-left-color:var(--ol-lightblue-w53); }

.descgrid .card-img img { width:780px; }
.descgrid .card-badge { width:13.846%; }
.descgrid .card-body { text-align:center; color:var(--ol-ui-gray); }




.widget-highlighticons { background:var(--ol-lightgray2); }

.highlighticons-panel { color:var(--ol-uigray); }
.highlighticons-label-footnote { font-size:1em; }

.faq-title { color:var(--ol-aquateal); }
.faq-lists .accordion-button { border-color:var(--ol-aquateal); }
.faq-lists .accordion-button:not(.collapsed) { background-color:var(--ol-aquateal); color:white; }
.faq-lists .accordion-button p { margin-bottom:0; }



.widget-clickbanner { background:var(--ol-lightgray2); }
.clickbanner-main .h3, .clickbanner-main .h4 { color:var(--ol-ui-gray); }




.form_body .subject { flex:0 1 66%; }
.form_body .orgname { flex:0 1 32%; }




.site-footer { font-size:1rem; }
.footer-contents a:hover { color:var(--ol-aquateal); }




@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { 
	
}

@media (max-width: 1649.98px) {
    .trusted-cards { gap:1em; }
    .trusted-cards .card { width:calc(25% - 1em); }
}
@media (min-width: 1400px) {
    .trusted-cards .card { max-width:326px;	}
}
@media (max-width: 1399.98px) {
	
}
@media (max-width: 1219.98px) {
	
}
@media (min-width: 1200px) {
    p { font-size:1.375rem; line-height:1.6em; }

    .form_body input, .form_body textarea { font-size:1.375rem; line-height:1.6em; }

    .descgrid-text .hdr { font-size:4.5rem; }
    
    .descgrid .hero-spec-front { border:3px solid var(--ol-lightgray2); border-radius:1em; color:var(--ol-ui-gray); padding:2.5rem 2rem; }
}
@media (max-width: 1199.98px) {
    p { font-size:calc(1.275rem + 0.3vw); line-height:1.6em; }
    .h2, h2 { font-size:clamp(44px, 44px + 12 * (100vw - 640px) / 560, 56px); }

    .trusted-cards .card { width:calc(50% - .5em); }
    .trusted-cards .card-text { font-size:1.125rem; }

	.lineup-cards .card-img img { width:360px; }
    /* .lineup-cards .card-badge { font-size:1.8rem; } */

    .img-iso4074 { width:160px; }

    .desc-contents { padding-top:3rem; padding-bottom:3rem; }
    .descgrid .card-img img { width:600px; }

    .descgrid-text { flex:0 1 calc(50% - 1em) }
    .descgrid-spec { flex:0 1 calc(50% - 1em) }
}
@media (min-width: 992px) {
	
}
@media (max-width: 991.98px) {
    .btn.general.large { font-size:1.5rem; }

    .nav-item .dropdown-menu { font-size:1rem; }
    
	.lineup-cards .card-img img { width:260px; }
    /* .lineup-cards .card-badge { font-size:1.3rem; } */

    .widget-aboutus_intro .hdr { margin-bottom:1em; }
    
    .textgrid { flex-direction:column; }
    .textgrid-left { order:1; padding:0; }
    .textgrid-right { order:0; }
    .textgrid-right .textgrid-img-container { position:relative; width:100%; margin-bottom:2em; }

    .textgrid-text-container + .textgrid-text-container { margin-top:2em; }

    .widget-aboutus_karex .container-fluid { max-width:720px; margin-left:auto !important; margin-right:auto !important; }
    .widget-aboutus_karex .simplepanel-contents { padding-top:2rem; }
    .widget-aboutus_karex .img-body { aspect-ratio:16/9; }
    .widget-aboutus_karex .hdr { text-align:left; display:block; margin-left:auto; margin-right:auto; }
    .widget-aboutus_karex .hdr br { display:none; }

    .descgrid-text { flex:0 1 calc(40% - 1em) }
    .descgrid-spec { flex:0 1 calc(60% - 1em) }

    .descgrid .card-img img { width:500px; }
    
}
@media (min-width: 768px) {
	
}
@media (max-width: 767.98px) {
	.lineup-cards .card-img img { width:100%; }
    .lineup-cards .card-badge { transform:translateX(30%) translateY(-50%); }

    .img-iso4074 { width:130px; }

    .desc-contents { padding-top:3rem; padding-bottom:3rem; }
    .descgrid { flex-direction:column; }
}
@media (max-width: 575.98px) {
    .widget-billboard.art-hero .art_title h1 { display:inline-block; margin:0; }
    .widget-billboard.art-hero .art_title br { display:none; }
    .widget-billboard.art-hero > .text h1, .widget-billboard.art-hero > .text h2 { font-size:11.284vw; line-height:11.284vw; }

    .trusted-cards .card { width:100%; }

	.lineup-cards { flex-direction:column; }
	.lineup-cards .card { align-items:center; }
    .lineup-cards .card-img img { width:100%; }
    .lineup-cards .card-badge { transform:translateX(0%) translateY(-50%); /* font-size:6vw; */ }

    .widget-product_hero { aspect-ratio:4/3;}
}
@media (max-width: 479.98px) {
	.hdr .decoline::after { top:1.1em; width:54px; }
}
@media (max-width: 374.98px) {
    .h2, h2 { font-size:calc(1.75rem + .9vw); }
}
