@charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */
.greeting .img{margin-bottom:var(--size35);}
.greeting .tt-wrap{position:relative;}
.greeting .tt-wrap:before{content: '';width:412px;height:415px;position: absolute;right:0;bottom:0;background:url('/images/sub/greeting-deco.png')no-repeat 100% 50%/contain;z-index:0;}
.greeting .tt-wrap .tit{margin-bottom:var(--size5);font-size:var(--fz32);font-weight:700;line-height:1.3em;color:var(--dark);}
.greeting .tt-wrap .tt1{margin-bottom:var(--size30);font-size:var(--fz24);font-weight:500;color:var(--dark);line-height:1.4em;}
.greeting .tt-wrap .wrap p{margin-bottom:var(--size20);}
.greeting .tt-wrap .wrap p:last-child{margin-bottom:0;}
.greeting .tt-wrap .ceo{margin-top:var(--size80);font-weight:600;font-size:var(--fz18);} 

.vision .content{margin-bottom:var(--size100);}
.vision .content:last-child{margin-bottom:0;}
.vision .content .title{font-size:20px;font-weight:700;color:var(--pri);line-height:1.4em;margin-bottom:20px;text-align:center;}
.vs .rest-wrap{display: flex;justify-content:center;border:20px solid rgba(190, 78, 41, 0.20);border-radius:200px;padding:var(--size50) 20px;gap:15px;margin-bottom:40px;}
.vs .rest-wrap p{font-size:var(--fz32);color:var(--dark);line-height:1.25em;text-align:center;}
.vs .arr-con{text-align:center;}
.vs .arr-con .tt20{color:var(--dark);font-weight:500;}
.vs .arr-con .arr{margin:var(--size35) 0;}

.ide ul{display: flex;flex-wrap:wrap;justify-content:center;margin:0 -10px -20px;}
.ide ul li{width:33.3333%;padding:0 10px;margin-bottom:20px;}
.ide ul li .box{height:100%;padding:var(--size80) 20px;text-align:center;border: 1px solid #ddd;border-radius:var(--bd24);}
.ide ul li .box .ic{margin-bottom:var(--size35);}
.ide ul li .box .tit{margin-bottom:var(--size10);font-size:var(--fz20);font-weight:700;color: #000;line-height:1.4em;}

.history .top-img{margin-bottom:var(--size60);}
.history .top-img img{border-radius:var(--bd40);}
.history .con{position:relative;padding:0 60px;}
.history .con:before{content: '';width:1px;height:88%;position:absolute;left:250px;top:20px;background-color: #ddd;z-index:-1;}
.history .con .row{margin-bottom:var(--size70);display: flex;}
.history .con .row:last-child{margin-bottom:0;}
.history .con .row .year{width:190px;color:var(--dark);font-size:var(--fz40);line-height:1.2em;font-weight:700;position:relative;color:transparent;font-size:0;}
.history .con .row .year:before{content:'';width:16px;height:16px;border-radius:50%;background:url('/images/sub/history-bullet.png')no-repeat 50% 50%/contain;position:absolute;right:-8px;top:15px;}
.history .con .row .info{padding-left:90px;padding-top:5px;}
.history .con .row .info ul li{line-height:2em;font-size:var(--fz20);display:block;}
.history .con .row .info ul li:last-child{margin-bottom:0;}
.history .con .row .info ul li .month{width:100%;font-weight:700;color:var(--pri);}
.history .con .row .info ul li .txt{width:100%;}

.license-list ul{display: flex;margin:0 -20px;}
.license-list ul li{width:33.3333%;padding:0 20px;}
.license-list ul li .pic{position:relative;}
.license-list ul li .pic:before{content:'';width:100%;height:100%;position:absolute;left:0;top:0;border:1px solid #ddd}

.location .maps .root_daum_roughmap {width:100% !important; height:500px !important;}
.location .maps .root_daum_roughmap .wrap_map {height:500px !important;}
.location .maps .roughmap_lebel_text {line-height:0 !important; font-size:0 !important;}
.location .maps .map_border{display:none;}
.location .maps .roughmap_lebel_text:after {content:"(주)범일유통"; font-size:12px; line-height:15px;}
.directions {margin-top:40px;}
.directions .address-info {margin-bottom:var(--size45);}
.directions .address-info .comp {color:var(--pri); font-weight:700; margin-bottom:5px;font-size:var(--fz20);line-height:1.4em;}
.directions .address-info .addr {color:#242424; font-size:var(--fz28); font-weight:700; line-height:1.33em; margin-bottom:5px;}
.directions .address-info .etc {color:#454545;}
.directions .address-info .etc span {display:inline-block; margin-right:16px;}
.directions .address-info .etc span:last-child {margin-right:0;}
.directions .contact-info {border-top:1px solid #ddd; line-height:1.5em;}
.directions .contact-info dl {display:flex; padding:28px 0; border-bottom:1px solid #ddd;}
.directions .contact-info dt {width:180px; padding-left:30px; color:#242424; font-weight:600;}
.directions .contact-info dt svg {vertical-align:middle; margin:-.2em 15px 0 0;height:24px;width:24px;}
.directions .contact-info dt path {fill:var(--pri);}
.directions .contact-info dd {flex:1 1 auto; min-width:0; width:1%; color:#454545;}

@media (max-width: 1024px) {
	.location .maps .root_daum_roughmap {width:100% !important; height:300px !important;}
    .location .maps .root_daum_roughmap .wrap_map {height:300px !important;}
	.directions .address-info .addr {font-size:20px;}
	.directions .contact-info dl {padding:20px 0;}
	.directions .contact-info dt {padding-left:20px; width:140px;}
    .directions .contact-info dt svg{width:auto;height:auto;}
}

@media (max-width: 640px) {
	.location .maps .root_daum_roughmap {width:100% !important; height:200px !important;}
    .location .maps .root_daum_roughmap .wrap_map {height:200px !important;}
	.directions {margin-top:30px;}
	.directions .address-info .addr {font-size:18px;}
	.directions .address-info {margin-bottom:20px;}
	.directions .contact-info dl {padding:16px 0;}
	.directions .contact-info dt {padding-left:5px; width:110px;}
	.directions .contact-info dt svg {margin-right:10px;}
}

.capa ul{display: flex;flex-wrap:wrap;margin:0 -20px -40px;}
.capa ul li{padding:0 20px;margin-bottom:40px;width:50%;}
.capa ul li .box{padding:var(--size40);border:1px solid #ddd;height:100%;}
.capa ul li .box .ic{margin-bottom:var(--size60);}
.capa ul li .box .tit{color: #000;font-size:var(--fz24);line-height:1.4em;font-weight:600;margin-bottom:var(--size5);}
.capa ul li .box .txt{color:rgba(190, 78, 41, 0.30);;font-size:var(--fz18);line-height:1.4em;font-weight:600;margin-bottom:var(--size20);}
.capa ul li .box .info .row{margin-bottom:5px;}
.capa ul li .box .info .row:last-child{margin-bottom:0;}

.process .row{display: flex;margin-bottom:40px;}
.process .row:last-child{margin-bottom:0;}
.process .row .img{width:50%;}
.process .row .tt-wrap{width:50%;padding-left:40px}
.process .row .tt-wrap .cate{margin-bottom:var(--size10);line-height:1.2em;color:var(--pri);font-weight:600;font-size:var(--fz18);}
.process .row .tt-wrap .tit{font-size:var(--fz32);font-weight:700;color:var(--dark);line-height:1.3em;}
.dot-list li{padding-left:.6em;text-indent:-.6em;}
.process .row .tt-wrap .info{margin-top:var(--size45);}
.process .row .tt-wrap .info .tt{margin-bottom:var(--size25);}
.process .row .tt-wrap .info .tt:last-child{margin-bottom:0;}

.pr-view{margin-top:var(--size100);}
.pr-view .top-con{display: flex;}
.pr-view .top-con .img{width:580px;margin-right:40px;}
.pr-view .top-con .img .pic {position:relative; height:0; padding-bottom:68.968%; overflow:hidden;}
.pr-view .top-con .img .pic:after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;border:1px solid #ddd;width:100%;height:100%;}
.pr-view .top-con .img .pic img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
.pr-view .top-con .tt-wrap{min-width:0;width:1%;flex:1 1 auto;padding-top:var(--size45);}
.pr-view .top-con .tt-wrap .tit{font-size:var(--fz32);font-weight:700;line-height:1.3em;color:var(--dark);}
.pr-view .top-con .tt-wrap .info{margin-top:var(--size20);}
.pr-view .top-con .tt-wrap .info dl{display: flex;margin-bottom:5px;}
.pr-view .top-con .tt-wrap .info dl:last-child{margin-bottom:0;}
.pr-view .top-con .tt-wrap .info dl dt{width:80px;font-weight:600;color:var(--dark);}
.pr-view .top-con .tt-wrap .info dl dd{min-width:0;width:1%;flex:1 1 auto;}
.pr-view .detail{margin-top:var(--size80);}
.pr-view .detail .tit{font-size:var(--fz24);font-weight:700;color:var(--dark);margin-bottom:var(--size15);}
.pr-view .detail .cnt{border-bottom: 1px solid #ddd;border-top: 1px solid #ddd;padding:15px 0;}
.doc-btn{margin:var(--size60) auto 0;display: flex;justify-content:center;align-items:center;width:160px;height:48px;border-radius:48px;background-color:var(--pri);color: #fff;border:none;line-height:1.2em;font-weight:700;cursor:pointer;}

.radio-wrap{display: flex;gap:10px var(--size40);flex-wrap:wrap;align-items:center;min-height:44px;}
.radio-wrap .radiobox label:before{background-color: #FFF;}
.radio-wrap .radiobox label:before {width:20px;height:20px;}
.radio-wrap .radiobox input:checked + label:before {background-size:12px;border-color:var(--pri);}

.partner-list ul {display: grid; grid-template-columns: repeat(5, 1fr); gap: var(--size20);}
.partner-list li {border: 1px solid #ddd; border-radius: var(--size10); aspect-ratio: 224 / 66; display: flex; align-items: center; justify-content: center; overflow: hidden;}
.partner-list li img {width: 100%; height: 100%; object-fit: cover;}