@charset "UTF-8"; .board_search, .board_search *, .board_list>table .bo_tit>a, .paging_all *, .view_file>a, .pageNavigation, .pageNavigation>dl, .pageNavigation>dl>dd>a, .comment_Area a, .board_write input[type=text], .board_write input[type=password], .board_write input[type=file], .board_write select, .board_write textarea, .board_write .btns, .faqArea>li .q, .faqArea>li .q:before, .faqArea>li .q>.bul, .faqArea>li .q>.bul:before, .faqArea>li .q>.bul:after, .faqArea>li .q:after, .photo_list ul.list li .gall_cont, .photo_list ul.list li .gall_cont p.over, .photo_list ul.list li .gall_cont p.over:before, .photo_list ul.list li .gall_cont p.over:after, .photo_list ul.list li .gall_cont p.over>span, .storeMapType2 .storeMap_list .link{transition: all .3s ease-out; transform-origin: 50% 50%;} /* Input Style */ input[type=button], input[type=text], input[type=password], input[type=file], input[type=submit], select, textarea, .board_write .btns{width:auto; height:5rem; padding:0 2rem; background-color:#fff; border:1px solid var(--bor_c); font-size:1.6rem; line-height:4.8rem; color:#666; vertical-align:middle; display:inline-block;} select{padding-right:5rem; background:url('/images/bg_select.svg') no-repeat calc(100% - 1rem) center; background-size:1.5rem; -webkit-appearance: none; -moz-appearance: none; appearance: none;} select::-ms-expand{display:none;} textarea{width:100%; height:30rem; padding:2rem; line-height:1.55;} input[required], textarea[required]{background-image:url('/images/require.png'); background-repeat:no-repeat; background-position:right top} select[required]{background-image:url('/images/require.png'), url('/images/bg_select.svg'); background-repeat:no-repeat; background-position:right top, calc(100% - 1rem) center; background-size:1.5rem;} input[type=text].datetimepicker{background-image:url('/images/icon_calendar4.gif'); background-repeat:no-repeat; background-position:right center; background-size:contain;} input[type=text].datetimepicker[required]{background-image:url('/images/require.png'), url('/images/icon_calendar4.gif'); background-position:right top, right center; background-size:auto, contain;} /* Check New Style */ .check-new{font-size:0; line-height:0; display: inline-block; vertical-align: top; position: relative;} .check-new input[type=checkbox], .check-new input[type=radio]{display: none; position: absolute; left:0; top:0;} .check-new input[type=checkbox]+label, .check-new input[type=radio]+label{font-size:1.6rem; line-height:1; color: #999; display: inline-flex; align-items: center; cursor: pointer; position: relative; gap:0.7rem;} .check-new .more{font-weight: 500; font-size:1.8rem; line-height:2rem; color: #111; display: inline-block; vertical-align: top; cursor: pointer; position: relative;} .check-new input[type=checkbox]+label>.graphic, .check-new input[type=checkbox]+label>.graphic:before, .check-new input[type=radio]+label>.graphic, .check-new input[type=radio]+label>.graphic:before{content: ""; width: 2rem; height: 2rem; background-color: #fff; border:1px solid var(--bor_c); font-size:0; line-height:0; display: inline-block; vertical-align: top; position: relative; transition: .3s;} .check-new input[type=checkbox]+label>.graphic:before{background: url('data:image/svg+xml;utf8,') no-repeat left top/cover; border:none; left:-1px; top:-1px; z-index:2; opacity: 0.3;} .check-new input[type=radio]+label>.graphic{border-radius:99px;} .check-new input[type=radio]+label>.graphic:before{width: 50%; height: 50%; background-color:var(--btn_c); border:none; left: 50%; top:50%; border-radius:99px; transform-origin: 50% 50%; transform: translate(-50%, -50%); opacity:0.3;} .check-new input[type=checkbox]:checked+label>.graphic{border-color:var(--btn_c);} .check-new input[type=radio]:checked+label>.graphic{border-color:var(--btn_c);} .check-new input[type=radio]:checked+label>.graphic:before{background-color:var(--btn_c);} .check-new input[type=checkbox]:checked+label>.graphic, .check-new input[type=checkbox]:checked+label>.graphic:before, .check-new input[type=radio]:checked+label>.graphic, .check-new input[type=radio]:checked+label>.graphic:before{opacity: 1;} .check-new input[type=checkbox]:checked+label, .check-new input[type=radio]:checked+label{color: var(--btn_c);} /* Clause Box Style */ .clauseArea{width:100%; font-size:0; line-height:0; overflow:hidden;} .clauseArea.max{max-width:80rem; margin:0 auto; } .clauseArea + .clauseArea, .board_write + .clauseArea{margin-top:5rem;} .clauseArea>.tit{margin-bottom:1.5rem; font-weight: 700; font-size:2.6rem; line-height:1; color: #1b1b1b;} .clauseArea .scroll-boxs{width:100%; padding:4rem 3rem 4rem 2rem; background-color: #fff; border:1px solid #c2c2c2; box-sizing:border-box; border-radius: 0 7rem 0 7rem;} .clauseArea .scroll{width:100%; height:30rem; padding:3rem; background-color: #fff; border:1px solid var(--bor_c); border-radius:1rem; font-size:1.6rem; line-height:1.55; color: #666; overflow:hidden; overflow-y:auto; box-sizing:border-box;} .clauseArea .scroll-boxs>.scroll{border:none;} .clauseArea .scroll strong{font-weight: 400;} .clauseArea .scroll>p{margin:3rem 0 0.5rem;} .clauseArea .scroll>p:first-child{margin-top:0rem;} .clauseArea .scroll>p>strong{font-weight: 700; color: #1b1b1b; display:inline-block;} .clauseArea .scroll *+p>strong{} .clauseArea .scroll ol{counter-reset:item; margin-top:1rem;} .clauseArea .scroll li>p{margin-top:1rem;} .clauseArea .scroll ol>li>ol{margin-top:0rem;} .clauseArea .scroll ol>li{margin-left:-0.5rem; padding-left:2.5rem; position: relative; box-sizing:border-box;} .clauseArea .scroll ol>li:before {counter-increment: item; content: counter(item)"."; width:2rem; text-align: right; display: inline-block; position: absolute; top: 0; left: 0;} .clauseArea .scroll ol>li:nth-child(-n+9)::before {content: "0"counter(item);} .clauseArea .scroll ol.type>li{} .clauseArea .scroll ol.type>li:before{content: counter(item)")";} .clauseArea .scroll ol.cNum>li{} .clauseArea .scroll ol.cNum>li:before{content: "";} .clauseArea .scroll ol.cNum>li:nth-child(1):before{content: "①";} .clauseArea .scroll ol.cNum>li:nth-child(2):before{content: "②";} .clauseArea .scroll ol.cNum>li:nth-child(3):before{content: "③";} .clauseArea .scroll ol.cNum>li:nth-child(4):before{content: "④";} .clauseArea .scroll ol.cNum>li:nth-child(5):before{content: "⑤";} .clauseArea .scroll ol.cNum>li:nth-child(6):before{content: "⑥";} .clauseArea .scroll ol.cNum>li:nth-child(7):before{content: "⑦";} .clauseArea .scroll ol.cNum>li:nth-child(8):before{content: "⑧";} .clauseArea .scroll ol.cNum>li:nth-child(9):before{content: "⑨";} .clauseArea .scroll ol.cNum>li:nth-child(10):before{content: "⑩";} .clauseArea .scroll ol.cNum>li:nth-child(11):before{content: "⑪";} .clauseArea .scroll ol.cNum>li:nth-child(12):before{content: "⑫";} .clauseArea .scroll ol.kr>li{} .clauseArea .scroll ol.kr>li:before{} .clauseArea .scroll ol.kr>li:nth-child(1):before{content: "가.";} .clauseArea .scroll ol.kr>li:nth-child(2):before{content: "나.";} .clauseArea .scroll ol.kr>li:nth-child(3):before{content: "다.";} .clauseArea .scroll ol.kr>li:nth-child(4):before{content: "라.";} .clauseArea .scroll ol.kr>li:nth-child(5):before{content: "마.";} .clauseArea .scroll ol.kr>li:nth-child(6):before{content: "바.";} .clauseArea .scroll ol.kr>li:nth-child(7):before{content: "사.";} .clauseArea .scroll ol.kr>li:nth-child(8):before{content: "아.";} .clauseArea .scroll ol.kr>li:nth-child(9):before{content: "자.";} .clauseArea .scroll ol.kr>li:nth-child(10):before{content: "차.";} .clauseArea .scroll ol.kr>li:nth-child(11):before{content: "카.";} .clauseArea .scroll ol.kr>li:nth-child(12):before{content: "타.";} .clauseArea .scroll ol.kr>li:nth-child(13):before{content: "파.";} .clauseArea .scroll ol.kr>li:nth-child(14):before{content: "하.";} .clauseArea .scroll ul.buls>li{padding-left:1.5rem ; position: relative;} .clauseArea .scroll ul.buls>li:before{content: "-"; display: inline-block; position:absolute; left: 0; top:0;} .clauseArea .scroll ul.circle>li{padding-left:15px; position: relative;} .clauseArea .scroll ul.circle>li:before{content: "ο"; display: inline-block; position:absolute; left: 0; top:-1px;} .clauseArea .scroll li>ol, .clauseArea .scroll li>ul{margin-bottom:0.7rem;} .clauseArea .nTable{width:100%; margin-top:0.5rem; background-color: #fff; border-top:1px solid #ebebeb; border-right:1px solid #ebebeb;} .clauseArea .nTable>table{width:100%; border-spacing:0; table-layout: fixed;} .clauseArea .nTable>table th, .clauseArea .nTable>table td{padding:1.5rem; border-left:1px solid #ebebeb; border-bottom:1px solid #ebebeb; font-weight: 300; font-size:var(--f__size--15); line-height:1.3; color:#888; text-align:center; border-collapse:collapse; empty-cells:show;} .clauseArea .nTable>table>thead>tr>th{background-color: #f8f8f8; border-right:none; font-weight:500; color:#222; position: relative;} .clauseArea .nTable>table>thead>tr>th+th{} .clauseArea .check-new{padding-top:1.5rem; float:right;} .clauseArea.no .tit{display:none;} .clauseArea.no .scroll{height:auto; padding:0px; background-color: transparent; border:none; overflow: visible;} /* Search Style */ .board_search{margin-bottom:3rem; width:100%; font-size:0; line-height:0; display: flex; justify-content: flex-end; position: relative; z-index:2;} .board_search .mobile_Block{display:inline;} .board_search *+*{margin-left:1rem;} .board_search select, .board_search input[type=text], .board_search input[type=submit]{height:6rem; padding:0 2rem; background-color: #f7f7f7; border:0px solid #cecece; font-weight: 500; font-size:2rem; line-height:calc(6rem - 2px); color: #555; display:inline-block; vertical-align: top;} .board_search input[type=submit]{border:none} .board_search select{min-width:20rem; padding:0 5rem 0 3rem; background-image: url("/images/sch_select_ico.svg"); background-repeat: no-repeat; background-position:calc(100% - 2.5rem) center; background-size: 1.7rem; -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius:1rem; outline:none;} .board_search select::-ms-expand{display:none;} .board_search select:focus{border-color:#cecece !important; box-shadow:none;} .board_search input[type=text]{width:30rem; background-image:none;} .board_search input[type=text]:focus{border:none !important; box-shadow:none;} .board_search input[type=submit]{min-width:9rem; margin-left:-1px; background-color: #111; border-color:#111; font-size:1.6rem; line-height:1; color: #fff; cursor: pointer;} .board_search .bo_sch_in{display:flex; border-radius:1rem; border:0px solid #cecece; overflow:hidden;} .board_search .bo_sch_in input[type=text]{width:55rem; border:none} .board_search .bo_sch_in input[type=submit]{min-width:8rem; margin:0; padding:0; font-size:0; background:url("/images/sch_ico.svg") no-repeat center / 2.1rem; background-color:var(--point);} .board_search.prdt_sch{justify-content:center; margin:5rem 0 6rem;} .board_search.prdt_sch .bo_sch_in{max-width:80rem; width:100%;} .board_search.prdt_sch .bo_sch_in input[type=text]{width:100%;} /* Category Style */ .category_top{width:100%; margin: 0 auto 4rem; font-size:0; line-height:0; text-align: center; display:block; position: relative; z-index:8} .category_top h2{width:100%; height:8rem; padding:0 5rem 0 2rem; border:1px solid #ddd; font-weight: 500; font-size:1.7rem; line-height:1.4; color: #333; text-align: left; position: relative; display: none; flex-direction: row; align-items: center; justify-content: flex-start; } .category_top h2:after, .category_top h2:before{content: ""; width:1.4rem; height:1px; margin:0 0 0 0; background-color: #333; display: block; position:absolute; top:50%;} .category_top h2:after{right:2rem; transform:rotate(45deg);} .category_top h2:before{right:1rem; transform:rotate(-45deg);} .category_top>ul{display: flex; flex-wrap: wrap; flex-direction: row; justify-content: center;} .category_top>ul>li{flex:1; display:inline-block; vertical-align: top; position: relative;} .category_top>ul>li+li{margin-left:-1px;} .category_top>ul>li a{width:100%; height:7rem; padding:0 1.8rem; background-color: #f8f8f8; border:1px solid #e2e2e2; font-weight: 500; font-size:1.8rem; line-height:1.4; color: #666; display: flex; align-items: center; justify-content: center; white-space: nowrap;} .category_top>ul>li a>span{display:table-cell; vertical-align: middle; word-break:keep-all; word-wrap:break-word;} .category_top>ul>li#bo_cate_on{} .category_top>ul>li a#bo_cate_on, .category_top>ul>li a.active, .category_top>ul>li:hover a{background-color:var(--point); border-color:var(--point); color:#fff;} /* .category_top>ul>li:nth-of-type(1) a{background-color:#111 !important; border-color:#111 !important; color: #fff !important;} */ .category-depth3{display: flex;} .category-depth3>li{display: flex; margin:-2.5rem 0 3rem -1.1rem;} .category-depth3>li>a{padding:0 1rem 0 1.1rem; font-weight: 600; font-size:1.8rem; line-height:1.55; color: #666; display: flex; align-items: center; position: relative;} .category-depth3>li>a+a:before{content: ""; width: 1px; height: 1.5rem; background-color: #e2e2e2; display: inline-block; position:absolute; left: 0; top:50%; transform: translateY(-50%);} .category-depth3>li>a:is(:hover, .active){color:var(--point); text-decoration: underline; text-underline-position:under;} /* Category Check Style */ .category_chk{width:23rem; border:1px solid #ddd; position:sticky; left:0; top:11.1rem;} .category_chk .btn_cate_op{padding:2rem 3.8rem 2rem 2rem; width:100%; font-size:1.6rem; line-height:1.3; color:#666; display:flex; justify-content:space-between; position:relative;} .category_chk .btn_cate_op em{ font-weight:600; color:#111;} .category_chk .btn_cate_op::before{content:""; display:block; margin-top:-0.35rem; width:1.2rem; height:0.7rem; background:url("/img/ico_cate_chk_arrow.svg") no-repeat center/contain; position:absolute; top:50%; right:2.2rem; transform:rotate(180deg);} .category_chk .btn_cate_op.active::before{transform:rotate(0deg);} .category_chk .cate_ul_chk{padding:1rem 2rem 1.5rem;} .category_chk .cate_ul_chk .chk_box{} .category_chk .cate_ul_chk li+li{margin-top:1rem;} .category_chk .cate_ul_chk .check_innr{display:flex; justify-content:space-between; font-size:1.6rem; line-height:1.3;} .category_chk .cate_ul_chk .check_innr input{display:none;} .category_chk .cate_ul_chk .check_innr label{display:flex; align-items:center;} .category_chk .cate_ul_chk .check_innr label .graphic{margin-right:1rem; display:inline-block; width:1.6rem; height:1.6rem; border:1px solid #ddd; border-radius:0.2rem; background-color:#fff; position:relative;} .category_chk .cate_ul_chk .check_innr label .graphic::before{content:""; display:block; width:100%; height:100%; background:url("/img/ico_cate_chk.svg") no-repeat center; opacity:0;} .category_chk .cate_ul_chk .check_innr label p{font-weight:500; color:#333;} .category_chk .cate_ul_chk .check_innr input:checked + label p{color:#111; font-weight:600;} .category_chk .cate_ul_chk .check_innr input:checked + label .graphic{border-color:var(--point); background-color:var(--point);} .category_chk .cate_ul_chk .check_innr input:checked + label .graphic::before{opacity:1;} /* Search Result */ .search-result{width:100%; margin: 2rem auto 4rem; font-size:0; line-height:0; text-align: center; display:block; position: relative; z-index:7;} .search-result h2{width:100%; height:7rem; padding:0 5rem 0 2rem; border:1px solid #ddd; font-weight: 500; font-size:1.7rem; line-height:1.4; color: #333; text-align: left; position: relative; display: none; flex-direction: row; align-items: center; justify-content: flex-start; } .search-result h2:after, .search-result h2:before{content: ""; width:1.4rem; height:1px; margin:0 0 0 0; background-color: #333; display: block; position:absolute; top:50%;} .search-result h2:after{right:2rem; transform:rotate(45deg);} .search-result h2:before{right:1rem; transform:rotate(-45deg);} .search-result>ul{margin:-0.5rem; display: flex; flex-wrap: wrap; flex-direction: row; justify-content: center;} .search-result>ul>li{margin:0.5rem; flex:0 1 16rem; display:inline-block; vertical-align: top; position: relative;} .search-result>ul>li a{width:100%; height:4.6rem; padding:0 2rem; border:1px solid #ddd; font-weight: 400; font-size:1.6rem; line-height:1.4; color: #666; white-space: nowrap; border-radius:99px; display: flex; flex-direction: row; align-items: center; justify-content: center;} .search-result>ul>li a>strong{font-weight: 400;} .search-result>ul>li a>span{width:2rem; height:2rem; margin-left:1rem; background-color: var(--point); font-size:1.2rem; line-height:2rem; color: #fff; text-align: center; border-radius:99px;} .search-result>ul>li a.sch_on, .search-result>ul>li:hover a{background-color:var(--point); border-color:var(--point); color:#fff;} .search-result>ul>li a.sch_on>strong{font-weight: 500;} .search-result>ul>li:hover a>span, .search-result>ul>li a.sch_on>span{background-color: #fff; color: var(--point);} /* Board Option */ .board_btn{width:100%; padding:2rem 0; font-size:0; line-height:0; display: flex; flex-flow: row wrap; justify-content: space-between; position: relative; z-index:2;} .board_btn>*{} .board_btn>.total{padding:1.1rem 0; font-weight: 300; font-size:1.5rem; line-height:1; color: #626262; text-align: left;} .board_btn>.total>strong{font-weight: 600; color:#333;} .board_btn .click{padding:0.8rem 1.3rem; background-color:#fff; border:1px solid var(--point); font-size:2rem; line-height:1.2; color:#333; text-align: center; overflow:hidden; display:inline-block; vertical-align: top; box-sizing:border-box; border-radius:1rem; cursor: pointer; position: relative; white-space: nowrap;} .board_btn .click.icon{display: flex; align-items: center; justify-content: center; gap: 1rem;} .board_btn .click .fa{margin-top:-0.3rem; vertical-align: middle;} .board_btn .click .fa.fa-pencil{text-decoration: underline;} .board_btn .click.big{min-width:20rem; padding:2.7rem 2.5rem; font-weight: 600;} .board_btn .click.admin{background-color: #d51020; border-color:#d51020; color: #fff;} .board_btn .click.write{background-color: var(--point); color: #fff;} .board_btn .click.cancel{border-color:#aaa;} .board_btn .click.delete{border-color:#aaa; background-color: #aaa;color: #fff;} .board_btn .board_user{} .board_btn .board_user>li{display:inline-block; vertical-align: top;} .board_btn .board_user>li+li{margin-left:1rem;} .board_btn.center{justify-content:center;} .board_btn.end{justify-content: flex-end;} .board_btn.write{margin-top:2rem; justify-content: center;} .board_btn.write .click.big{min-width:20rem; padding:2.7rem 2.5rem; font-weight: 400;} /* Category Style */ .multi-tab{width:100%; margin: 0 auto 4rem; font-size:0; line-height:0; text-align: center; display:block; position: relative;} .multi-tab .name{width:100%; height:7rem; padding:0 5rem 0 2rem; border:1px solid var(--point); font-weight: 600; font-size:1.7rem; line-height:1.4; color: var(--point); text-align: left; position: relative; display: none; flex-direction: row; align-items: center; justify-content: flex-start;} .multi-tab .name:after, .multi-tab .name:before{content: ""; width:1.4rem; height:1px; margin:0 0 0 0; background-color: var(--point); display: block; position:absolute; top:50%;} .multi-tab .name:after{right:2rem; transform:rotate(45deg);} .multi-tab .name:before{right:1rem; transform:rotate(-45deg);} .multi-tab ul.multi-list{display: flex; flex-wrap: wrap; flex-direction: row; justify-content: center; position: relative; gap:1rem;} .multi-tab ul.multi-list>li{flex:1; max-width:16rem; position: relative; z-index:2;} .multi-tab ul.multi-list>li a{width:100%; height:4.6rem; padding:0 2rem; border:1px solid #ddd; font-weight: 400; font-size:1.6rem; line-height:1.4; color: #666; display: flex; flex-direction: row; align-items: center; justify-content: center; white-space: nowrap; border-radius:99px; transition: all .3s ease-out;} .multi-tab ul.multi-list .radius{width: 10%; height: 100%; background-color:var(--point); border-color:var(--point); position:absolute; left: 45%; top:0px; border-radius:99px; opacity: 0;} .multi-tab:not(.line) ul.multi-list>li:is(:hover, .active) a{background-color:var(--point); border-color:var(--point); color:#fff;} .multi-tab ul.multi-list>li:is(.active) a{color:#fff;} .multi-tab ul.multi-list>li.active a{font-weight: 500;} /* Board List Style */ .board-total{margin-bottom:1.5rem; font-size:1.6rem; line-height:1; color: #626262; text-align: left;} .board-total>strong{font-weight: 700; color: #333;} .board_list{width:100%; border-top:1px solid var(--point); border-bottom:1px solid var(--bor_c); font-size:0; line-height:0; overflow:hidden;} .board_list>table{width:100%; margin-bottom:-1px; border-spacing:0;} .board_list>table th, .board_list>table td{padding:2.7rem 0; background-color: #fff; border-bottom:1px solid var(--bor_c); font-size:2.2rem; line-height:1.3; color:#555; text-align:center; border-collapse:collapse; empty-cells:show; word-break:break-all;} .board_list>table tr.notis>*{background-color: #f4f4f4;} .board_list>table tr.notis>.td_num2{font-weight: 700; color: var(--point);} .board_list>table tr.notis>.td_subject>a{font-weight: 700;} .board_list>table>thead>tr>th{background-color: #f9f9f9; font-weight: 700; color: #222;} .board_list>table .td_subject{text-align:left;} .board_list>table .td_subject>a{padding:0 5rem; display:inline-block; color:#222; cursor:pointer; max-width:95%; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; word-break:break-all !important;} .board_list>table .td_subject>a:hover{color:var(--point);} .board_list>table .td_subject>a .fa{margin:0 0.7rem 0.2rem 0; display:inline-block; vertical-align: middle;} .board_list>table .state{padding:1.4rem 0;} .board_list>table .state .icon{width:8rem; height:3.5rem; background-color: var(--point); border:1px solid var(--point); font-size:1.5rem; line-height:1; color: #fff; text-align: center; display: inline-flex; align-items: center; justify-content: center; border-radius:4px;} .board_list>table .state .icon.end{background-color: #ddd; border-color: var(--bor_c); color: #666;} .board_list>table .file{font-size:1.8rem;} .board_list>table .file>a{color: #666;} .board_list>table .store_photo{padding:1rem;} .board_list>table .store_photo img{max-height:12rem; object-fit:contain;} .board_list>table .noPost>td{height:20rem; vertical-align: middle;} .board_list.line>table{width:calc(100% + 1px);} .board_list.line>table th, .board_list.line>table td{border-right:1px solid var(--bor_c);} /* Board List Check Style */ .bo_list_wrap{display:flex; gap:3rem} .bo_list_wrap .bo_list_cont{flex:1;} .bo_list_wrap .bo_cate_chk .cate_filter_ul{display:none;} .bo_list_wrap .cate_filter_ul{padding-bottom:2rem; display:flex; gap:1rem; flex-wrap:wrap; border-bottom:1px solid #ddd;} .bo_list_wrap .cate_filter_ul li{padding:1.2rem 2rem; font-size:1.6rem; line-height:1.3; color:#333; font-weight:500; display:flex; gap:2rem; align-items:center; background-color:#f7f7f7; border-radius:4rem;} .bo_list_wrap .cate_filter_ul li .cate_del{line-height:0;} .bo_list_wrap .bo_list_top{padding:2rem 0; display:flex; gap:2rem; flex-wrap:wrap; align-items:center;} .bo_list_wrap .bo_list_top form[name="fsearch"]{flex:1;} .bo_list_wrap .bo_list_top .board_search{margin:0} .bo_list_wrap .bo_list_top .board_search .bo_sch_in{width:100%;} .bo_list_wrap .bo_list_top .board_search .bo_sch_in input[type=text]{width:auto; flex:1;} .bo_list_wrap .bo_list_top .board_btn{width:auto; padding:0} .bo_list_wrap .bo_list_top .board_btn .total{padding:0; font-size:1.6rem; line-height:1.3; font-weight:600; color:#666;} .bo_list_wrap .bo_list_top .board_btn .total strong{color:#111;} .bo_list_wrap .bo_list_top .mo_cate_open_btn{padding:1.5rem 2.6rem 1.6rem; display:none; gap:1rem; justify-content:center; align-items:center; font-size:1.8rem; line-height:1.3; font-weight:500; color:#888; background-color:#f7f7f7; border-radius:1rem;} .bo_list_wrap .bo_list_top .mo_cate_open_btn::before{content:""; display:block; width:2.6rem; height:2.9rem; background:url("/images/ico_filter.svg") no-repeat center/contain;} .mo_filter_submit{display:none; padding:2rem 3rem; border-top:1px solid #d9d9d9;} .mo_filter_submit button{width:100%; padding:2.2rem 2rem; font-size:2rem; line-height:1.3; font-weight:700; color:#fff; background-color:var(--point); border-radius:0.5rem;} /* Board List Style 2 */ h5.bul{margin:6rem 0 2.5rem; padding-left:2.2rem; font-weight: 500; font-size:2.4rem; line-height:1; color: #000; letter-spacing: -0.03em; position: relative;} h5.bul:before{content: ""; width: 1.4rem; height: 1.4rem; border:0.3rem solid var(--point); display: block; position:absolute; left:0; top:0.5rem; border-radius:999px;} h5.bul .more{padding:0.5rem 1rem; border:1px solid #dadada; font-weight: 400; font-size:1.4rem; color: #666; position: absolute; right:0; top:-0.2rem; display:inline-block;} .board_area .list{margin-top:-1px; border-top:1px solid var(--point);} .board_area .list>li{width:100%; padding:3rem 2rem; border-bottom:1px solid #ddd; display: flex; justify-content: space-between;} .board_area .list>li>*{display: flex; flex-direction: row; align-items: center; justify-content: center;} .board_area .list>li>a{width:100%; max-width:86%; padding-right:3rem; justify-content: flex-start;} .board_area .list>li>a .thumb{width:10rem; height:10rem; margin-right:2rem; border:1px solid #ddd; object-fit:contain; object-position: center center; } .board_area .list .title{overflow:hidden;} .board_area .list .title>dt{font-weight: 600; font-size:2rem; line-height:1.6; color: #1b1b1b; display: block; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis;} .board_area .list .title>dd{padding-top:1rem; margin-left:-1.7rem;} .board_area .list .title>dd>span{padding:0 1.6rem 0 1.7rem; font-size:1.7rem; line-height:2.8rem; color: #555; display: inline-block; position: relative;} .board_area .list .title>dd>span:before{content: ""; width: 1px; height: 1.4rem; background-color: #dbdbdb; display: inline-block; position:absolute; left: 0; top:50%; transform: translateY(-50%);} .board_area .list .title>dd>div{padding:0 1.6rem 0 1.7rem; font-size:1.7rem; line-height:2.8rem; color: #555; display: block; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; position: relative;} .board_area .list>li>.etc{white-space: nowrap;} .board_area .list>li>.etc>.category>span, .board_area .list>li>.etc>.day{height:3.4rem; line-height:1; color: #333; display: flex; flex-direction: row; align-items: center; justify-content: center;} .board_area .list>li>.etc .category{} .board_area .list>li>.etc .category>span{width:9rem; border:1px solid #aaa; font-size:1.6rem;} .board_area .list>li>.etc .day{margin-left:3rem; font-weight: 300; font-size:1.8rem;} .board_area .list>li.noPost{height:40rem; font-weight: 400; font-size: 1.6rem; line-height:1.5; color: #666; display: flex; flex-wrap: wrap; flex-direction: row; align-items: center; justify-content: center;} /* 검색결과 색상 */ .sch_word{padding:0.2rem 0.5rem 0.3rem; margin:0 0.2rem; position: relative; z-index:2;} .sch_word:before{content: ""; background-color:rgba(0,255,255,0.7); display:block; position:absolute; left: 0.2rem; right: 0.2rem; top:50%; bottom:15%; z-index:-1;} /* Pageing Style */ .paging_all{width:100%; margin:6rem auto 0; font-size:0; line-height:0; text-align:center; position:relative; display: flex; align-items: center; justify-content: center; gap:1.5rem;} .paging_all .btns, .paging_all>.num>strong, .paging_all>.num>a{width:4rem; height:4rem; background-color: #fff; border:1px solid var(--bor_c); text-align: center; display: flex; align-items: center; justify-content: center; position: relative;} .paging_all .btns, .paging_all .btns *{font-size:0 !important; line-height:0 !important;} .paging_all .btns:before, .paging_all .btns:after{content: ""; width: 1.2rem; height: 1.2rem; border-width:1px 0 0 1px; border-style:solid; border-color:#666; display: inline-block; position:absolute; left: 50%; top:50%;} .paging_all .btns:after{opacity: 0;} .paging_all .btns.prev:before{margin:-0.6rem 0 0 -0.3rem; transform:rotate(-45deg);} .paging_all .btns.next:before{margin:-0.6rem 0 0 -0.9rem; transform:rotate(135deg);} .paging_all>.num{margin:0; display: inline-flex; align-items: center; gap:0.5rem;} .paging_all>.num>strong, .paging_all>.num>a{font-weight: 300; font-size:1.6rem; line-height:1; color:#666;} .paging_all>.num .pg_start{} .paging_all>.num .pg_end{} .paging_all .btns:hover{background-color: var(--btn_c); border-color:var(--btn_c);} .paging_all .btns:hover:before, .paging_all .btns:hover:after{border-color:#fff;} .paging_all>.num>strong, .paging_all>.num>a:hover{background-color: var(--btn_c); border-color:var(--btn_c); color:#fff; z-index:2;} /* Board View */ .board_view{width:100%; border-top:2px solid var(--btn_c); border-bottom:1px solid var(--bor_c); overflow:hidden;} .board_view>table{width:100%; margin-bottom:-1px; border-spacing:0;} .board_view>table th, .board_view>table td{padding:2rem 0; background-color: #fff; font-weight: 400; font-size:1.6rem; line-height:1.5; color:#555; text-align:left; border-collapse:collapse; empty-cells:show; word-break:break-all;} .board_view>table>thead>tr>th{padding:2.5rem 2rem 2.5rem; border-bottom:1px solid var(--bor_c); font-size:0; text-align: left;} .board_view>table .view_cate{padding-bottom:0.3rem; font-weight: 400; font-size:1.5rem; color:var(--point);} .board_view>table .view_title{font-weight: 700; font-size:2.2rem; line-height:1.4; color: #333; word-break: break-word !important;} .board_view>table .view_tit{margin-top:0.5rem; font-size:1.6rem;} .board_view>table .view_info{margin-top:1rem; display: flex; align-items: center; justify-content: space-between;} .board_view>table .view_info>*{display: flex; align-items: center; justify-content: space-between;} .board_view>table .view_info p.txt{font-size:1.6rem; color: #888; text-align:center; display:inline-block; vertical-align: top; position: relative;} .board_view>table .view_info p.txt>strong{font-weight: 400; color: #333;} .board_view>table .view_info p.txt>strong:after{content: ":"; padding-left:0.4rem;} .board_view>table .view_info p.txt+p.txt{margin-left:3.3rem;} .board_view>table .view_info p.txt+p.txt:before{content: ""; width:1px; height:1rem; margin-top:-0.5rem; background-color: #ccc; display: inline-block; position:absolute; left: -1.7rem; top:50%;} .board_view>table .state{padding-left:2rem;} .board_view>table .state .icon{width:8rem; height:3.5rem; background-color: var(--point); border:1px solid var(--point); font-size:1.5rem; line-height:1; color: #fff; text-align: center; display: inline-flex; align-items: center; justify-content: center; border-radius:4px;} .board_view>table .state .icon.end{background-color: #ddd; border-color: var(--bor_c); color: #666;} .board_view>table .state.event .icon{border-radius:99px;} .board_view>table .e_icon{padding-left:2rem;} .board_view>table .e_icon>span{width:10rem; height:3rem; background-color: #fff; border:1px solid #035ab6; font-size:1.5rem; line-height:2.8rem; color: #035ab6; text-align: center; display: block; border-radius:99px;} .board_view>table .e_icon.ing>span{background-color: #035ab6; border-color:#035ab6; color: #fff;} .board_view>table .e_icon.end>span{background-color: #b3b3b3; border-color:#b3b3b3; color: #fff;} .board_view>table .view_cont{padding:4.5rem 2rem;} .board_view>table #bo_v_img{text-align: center;} .board_view>table #bo_v_img img, .board_view>table .wideFrame{width:auto !important; height:auto !important; margin-bottom:3rem;} .board_view>table #bo_v_con{padding-bottom:6.5rem;} html[lang="en"] .board_view>table #bo_v_con *{word-break:break-word !important;} .board_view td.answer{padding:4rem 3rem; background-color: #f9f9f9; border-top:1px solid var(--bor_c); text-align: left; vertical-align: top;} .board_view td.answer>.tit{padding-bottom:1.5rem; font-weight: 500; font-size:2.2rem; line-height:1; color: #333;} .view_file{margin:-1rem 0 0 -1rem; display: flex; flex-wrap: wrap; justify-content: flex-start;} .view_file>a{margin:1rem 0 0 1rem; padding:0.95rem 1.6rem; background-color: #fff; border:1px solid #999; font-size:1.5rem; line-height:1; color: #333; display: flex; flex-wrap: wrap; flex-direction: row; align-items: center; justify-content: center; border-radius:4px; box-sizing:border-box; white-space: nowrap;} .view_file>a:hover{border-color:var(--point); color:var(--point);} /* 매장찾기 */ #storeMap{width:100%; height:40rem; margin-bottom:4rem;} #storeLayMap{width:100%; height:40rem; margin-bottom:4rem;} .customoverlay{border: 1px solid #ccc; border-bottom:2px solid #ddd; position:relative; bottom:50px; border-radius:6px;} .customoverlay:nth-of-type(n) {border:0; box-shadow:0px 1px 2px #888;} .customoverlay .coBox{background: #258ff6 url("https://t1.daumcdn.net/localimg/localimages/07/mapapidoc/arrow_white.png") no-repeat right 14px center; background-size: 8px; font-weight:500; font-size:1.4rem; color:#111; text-align:center; border-radius:6px; overflow:hidden; display:block;} .customoverlay .title {margin-right:35px; padding:5px 15px 7px; background-color:#fff; font-weight:500; font-size:1.4rem; line-height:1.6; text-align:center; display:block;} .customoverlay:after {content:''; width:22px;height:12px; margin-left:-11px; background:url('https://t1.daumcdn.net/localimg/localimages/07/mapapidoc/vertex_white.png') no-repeat left top; background-size: cover; position:absolute; left:50%; bottom:-12px;} .store_view{width:100%; padding-bottom:5rem; display: flex; justify-content: space-between;} .store_view #storeMap{margin-bottom:0;} .store_view>*{width:50%; max-width:66.5rem; order: 2; border:1px solid #ccc;} .store_view .right_box{margin-right:3rem; order: 1;} .storePhoto{width:100%; position: relative; overflow:hidden;} .storePhoto .slider{width:100%; background-repeat: no-repeat; background-position: center center; /*background-size: cover; */background-size: contain; box-sizing: border-box; position: relative; display:inline-block; vertical-align: top;} .storePhoto .slider img{width:100%;} .storePhoto .store-big{width:100%; position: relative;} .storePhoto .store-big_in{white-space: nowrap;} .storePhoto .store-big .sl.board_btn .click.bigider{width:100%; min-height:40rem;} .storePhoto .store-big .store-big-cont{width:9rem; height:4rem; background-color:rgba(235,235,235,0.7); text-align: center; position: absolute; left:50%; bottom:0; z-index:7; display: flex; flex-wrap: wrap; flex-direction: row; align-content: center; justify-content: center; border-radius:4px 4px 0 0; transform: translateX(-50%);} .storePhoto .store-big .store-big-cont>span.l{padding:0 0.4rem; display:inline-block;} .storePhoto .store-big .store-big-cont.op{display:none;} .storePhoto .slick-arrow{width:4rem; height:9rem; background-color:rgba(235,235,235,0.7); background-repeat: no-repeat; background-position: center center; background-size: 2.5rem; border:none; font-size:0; line-height:0; position: absolute; top:50%; transform: translateY(-50%); z-index:7; cursor: pointer;} .storePhoto .slick-arrow.slick-prev{background-image: url('/theme/prix/img/board/arrow_30_left.svg'); left:0; border-radius:0 4px 4px 0;} .storePhoto .slick-arrow.slick-next{background-image: url('/theme/prix/img/board/arrow_30_right.svg'); right:0; border-radius:4px 0 0 4px;} .storePhoto .slick-arrow.slick-disabled{opacity: 0.3; cursor: default;} /* 제품 상세 */ .product_view{width:100%; padding-bottom:5rem; display: flex; justify-content: space-between; gap:5rem;} .product_view .left_box{max-width:calc(100% - 74rem); min-width:calc(50% - 2.5rem)} .product_view .right_box{width:50%; max-width:69rem;} .product_view .right_box .board_btn{padding-top:7rem;} .product_view .right_box .board_btn .click{display:flex; justify-content:center; align-items:center; gap:1rem; max-width:28rem; width:100%; padding:2.2rem 2rem; font-size:2rem; line-height:1.3; font-weight:600; color:var(--point); text-align:center; border:1px solid var(--point); border-radius:1rem;} .product_view .right_box .board_btn .click::after{content:""; display:block; width:2.5rem; height:2.5rem; background:url("/images/ico_cart_p.svg") no-repeat center/contain;} .product_view .productText{} .product_view .productText .view-hGroup{padding:3rem 0 3.5rem 1rem; display:flex; justify-content:space-between; gap:2rem; border-bottom:1px solid var(--point)} .product_view .productText .title{font-weight: bold; font-size:3rem; line-height:1.2; color: #111;} .product_view .productText .cert_mark_li{display:flex; gap:1.5rem; align-items:center;} .product_view .productText .prdt_info .spec_li dl{padding:2.7rem 1rem; display:flex; font-size:2rem; line-height:1.3; font-weight:500; color:#444; border-bottom:1px solid #ddd;} .product_view .productText .prdt_info .spec_li dt{width:11.5rem; color:#111; font-weight:600;} .product_view .productText .prdt_info .cont_box{margin-top:3rem; font-size:2rem; line-height:1.4;font-weight:500; color:#444;} .productPhoto{width:100%; position: relative; overflow:hidden;} .productPhoto .slider{width:100%; height:100%; background-repeat: no-repeat; background-position: center center; background-size: cover; aspect-ratio: 500/333; position: relative; display:inline-block; vertical-align: top;} .productPhoto .slider img{width:100%;} .productPhoto .product-big{width:100%; margin-bottom:2rem; border-radius:1.5rem; overflow:hidden; position: relative;} .productPhoto .product-big_in{white-space: nowrap;} .productPhoto .product-big .slider{width:100%;} .productPhoto .product-small{margin:0 auto; width:100%; max-width:74.5rem; position: relative;} .productPhoto .product-small_in{white-space: nowrap; padding:0 3rem;} .productPhoto .product-small .slider{width:100%; cursor: pointer; border:1px solid #ddd; border-radius:0.5rem;} /*.productPhoto .product-small .slider:before{content: ""; width: 100%; height: 100%; background-color: rgba(0,0,0,0.4); display: inline-block; position:absolute; left: 0; top:0px; } box-shadow:0 0 10px rgba(0,0,0,0.1);*/ .productPhoto .product-small .slick-slide{margin:0 1rem;} .productPhoto .product-small .slick-slide .slider{margin:0;} .productPhoto .product-small .slick-current .slider:before{opacity: 0;} .productPhoto .slick-arrow{width:4rem; height:9rem; background-repeat: no-repeat; background-position: center center; background-size: 2.2rem; border:none; font-size:0; line-height:0; position: absolute; top:50%; transform: translateY(-50%); z-index:7; cursor: pointer;} .productPhoto .slick-arrow.slick-prev{background-image: url('/images/ico_tail_arrow_p_l.svg'); left:0; border-radius:0 4px 4px 0;} .productPhoto .slick-arrow.slick-next{background-image: url('/images/ico_tail_arrow_p_r.svg'); right:0; border-radius:4px 0 0 4px;} .productPhoto .slick-arrow.slick-disabled{opacity: 0.3; cursor: default;} .product_view_btm{width:100%; margin-top:6rem; padding-bottom:5rem; font-size: 1.8rem; line-height:1.55; color: #666; position: relative;} .product_view_btm .product_view_btm_btn{width:100%; padding-bottom:2rem; margin-bottom:4rem; border-bottom:1px solid #111; position: relative;} .product_view_btm .product_view_btm_btn .pvb_re{padding-left:1.8rem; font-weight: 700; font-size: 3rem; line-height:3rem; color: #333; position: relative;} .product_view_btm .product_view_btm_btn .pvb_re:before {content: ""; width: 0.8rem; height: 3rem; background-color: var(--point); position: absolute; left: 0; top: 0;} .product_view_btm .view_sect_tit{padding-bottom:2rem; font-size:3rem; line-height:1.3; font-weight:700; color:#111; border-bottom:1px solid #ddd;} .product_view_btm .cont_area{padding:3rem 0} .product_view_btm .product_3d{margin-bottom:5rem;} .product_view_btm .product_3d .vr_script .frames-360, .product_view_btm .product_3d .vr_script .frames-360>*{width:100% !important; max-width:1400px; height:73.8rem !important; margin:0 auto;} .product_view_btm .product_3d .vr_script img{width:auto !important; height:73.8rem !important; max-width:100% !important; object-fit: contain; position: relative !important;} .product_view_btm .video_sect .cont_area{text-align:center;} .product_view_btm .video_sect .cont_area iframe{max-width:111.9rem; display:inline-block; width:100%; aspect-ratio:16/9; border-radius:1rem; overflow:hidden;} .product_view_btm .related_prdt{margin-top:10rem; position:relative;} .product_view_btm .related_prdt .sw_contain{overflow:hidden;} .product_view_btm .related_prdt .swiper-slide>a{display:block;} .product_view_btm .related_prdt .swiper-slide .thumb{width:100%; display:flex; aspect-ratio:386/290; position:relative; border-radius:0.5rem; overflow:hidden; border:1px solid #ddd;} .product_view_btm .related_prdt .swiper-slide .thumb img{width:100%; height:100%; object-fit:cover;} .product_view_btm .related_prdt .swiper-slide .txt{padding-top:1rem;} .product_view_btm .related_prdt .swiper-slide .txt .it_tit{font-size:2rem; line-height:1.3; font-weight:600; color:#111; display: -webkit-box; text-overflow: ellipsis; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; word-break:break-all !important;} .product_view_btm .related_prdt .sw_btn_box{display:flex; gap:2rem; position:absolute; right:0; top:1.4rem; z-index:3;} .product_view_btm .related_prdt .sw_btn_box .swiper-button{position:static; width:auto; height:auto; margin:0;} .product_view_btm .related_prdt .sw_btn_box .swiper-button::after{display:none;} .product_view_btm .related_prdt .sw_btn_box .swiper-button img{width:2.4rem;} /* 시공 상세 */ .portfolio_view{width:100%; padding-bottom:5rem; display: flex; justify-content: space-between; gap:2rem;} .portfolio_view .slider{width:100%; height:100%; background-repeat: no-repeat; background-position: center center; background-size: cover; aspect-ratio: 1490/844; position: relative; display:inline-block; vertical-align: top;} .portfolio_view .product-big{flex:1; width:100%; margin-bottom:2rem; border-radius:0.5rem; overflow:hidden; position: relative;} /* .portfolio_view .left_box{max-width:calc(100% - 53rem); min-width:calc(50% - 1rem)} */ .portfolio_view .left_box{min-width:auto; width:100%} /* .portfolio_view .right_box{width:50%; max-width:48rem; aspect-ratio:480/737;} */ @media only screen and (min-width : 1025px){ .portfolio_view .productPhoto{display:flex; align-items:center;} .portfolio_view .productPhoto .slick-arrow{width:100%; height:4rem; position:static; transform:translateY(0);} .portfolio_view .productPhoto .slick-arrow.slick-prev{background-image:url("/images/ico_tail_arrow_p_t.svg"); background-size:1.2rem;} .portfolio_view .productPhoto .slick-arrow.slick-next{background-image:url("/images/ico_tail_arrow_p_b.svg"); background-size:1.2rem;} .portfolio_view .productPhoto .product-small{width:23rem; /*position: absolute;right: 0;top: 50%;transform: translateY(-50%);*/} .portfolio_view .productPhoto .product-small .slick-slide{margin:1rem 0} } /* .portfolio_view .portfolio_map{height:calc(100% - 13.5rem); border-radius:1.5rem; overflow:hidden;} .portfolio_view .portfolio_map .root_daum_roughmap{width:100%; height:100%;} .portfolio_view .portfolio_map .root_daum_roughmap .wrap_map{height:100%;} .portfolio_view .portfolio_map .root_daum_roughmap .wrap_map .map_border{display:none;} */ .portfolio_view_btm .cont_wr{display:flex; gap:5rem; flex-wrap:wrap;} .portfolio_view_btm .cont_wr .cont_area{flex:1} .portfolio_view_btm .cont_wr .map_box{width:50%; max-width:48rem; aspect-ratio:480/737;} .portfolio_view_btm .cont_wr .portfolio_map{height:100%; max-height:73rem; border-radius:0.5rem; overflow:hidden;} .portfolio_view_btm .cont_wr .portfolio_map .root_daum_roughmap{width:100%; height:100%;} .portfolio_view_btm .cont_wr .portfolio_map .root_daum_roughmap .wrap_map{height:100%;} .portfolio_view_btm .cont_wr .portfolio_map .root_daum_roughmap .wrap_map .map_border{display:none;} .portfolio_view_btm{width:100%; margin-top:6rem; padding-bottom:5rem; font-size: 1.8rem; line-height:1.55; color: #666; position: relative;} .portfolio_view_btm .portfolio_view_btm_btn{width:100%; padding-bottom:2rem; margin-bottom:4rem; border-bottom:1px solid #111; position: relative;} .portfolio_view_btm .portfolio_view_btm_btn .pvb_re{padding-left:1.8rem; font-weight: 700; font-size: 3rem; line-height:3rem; color: #333; position: relative;} .portfolio_view_btm .portfolio_view_btm_btn .pvb_re:before {content: ""; width: 0.8rem; height: 3rem; background-color: var(--point); position: absolute; left: 0; top: 0;} .portfolio_view_btm .cont_sect{font-size:2rme; line-height:1.3; font-weight:500; color:#444;} .portfolio_view_btm .cont_sect+.cont_sect{margin-top:8rem;} .portfolio_view_btm .view_sect_tit{padding-bottom:2rem; font-size:3rem; line-height:1.3; font-weight:700; color:#111; border-bottom:1px solid #ddd;} .portfolio_view_btm .cont_area{padding:3rem 0} .portfolio_view_btm .info_sect .cont_area dl{display:flex;} .portfolio_view_btm .info_sect .cont_area dl+dl{margin-top:1.5rem;} .portfolio_view_btm .info_sect .cont_area dt{width:14rem; font-weight:600; color:#111;} .portfolio_view_btm .info_sect .cont_area dd{flex:1;} .portfolio_view_btm .video_sect .cont_area{text-align:center;} .portfolio_view_btm .video_sect .cont_area iframe{max-width:111.9rem; display:inline-block; width:100%; aspect-ratio:16/9; border-radius:1rem; overflow:hidden;} .portfolio_view_btm .related_prdt{margin-top:10rem; position:relative;} .portfolio_view_btm .related_prdt .sw_contain{overflow:hidden;} .portfolio_view_btm .related_prdt .swiper-slide>a{display:block;} .portfolio_view_btm .related_prdt .swiper-slide .thumb{width:100%; display:flex; aspect-ratio:386/290; position:relative; border-radius:0.5rem; overflow:hidden; border:1px solid #ddd;} .portfolio_view_btm .related_prdt .swiper-slide .thumb img{width:100%; height:100%; object-fit:cover;} .portfolio_view_btm .related_prdt .swiper-slide .txt{padding-top:1rem;} .portfolio_view_btm .related_prdt .swiper-slide .txt .it_tit{font-size:2rem; line-height:1.3; font-weight:600; color:#111; display: -webkit-box; text-overflow: ellipsis; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; word-break:break-all !important;} .portfolio_view_btm .related_prdt .sw_btn_box{display:flex; gap:2rem; position:absolute; right:0; top:1.4rem; z-index:3;} .portfolio_view_btm .related_prdt .sw_btn_box .swiper-button{position:static; width:auto; height:auto; margin:0;} .portfolio_view_btm .related_prdt .sw_btn_box .swiper-button::after{display:none;} .portfolio_view_btm .related_prdt .sw_btn_box .swiper-button img{width:2.4rem;} /* PageNavigation Style */ .pageNavigation{width:100%; margin-top:-1px; border-bottom:1px solid var(--bor_c); overflow:hidden; position: relative; z-index:2;} .pageNavigation>dl{width:100%; border-top:1px solid var(--bor_c); font-size:1.6rem; line-height:1.1; color: #333; display:table; table-layout: fixed;} .pageNavigation>dl>*{display:table-cell; vertical-align:middle; box-sizing:border-box; position: relative;} .pageNavigation>dl>dt{width:10.5rem; height:6.5rem; text-align:center; color:#333;} .pageNavigation>dl>dt:before{content: ""; width: 1rem; height: 1rem; border-width:1px 0 0 1px; border-style:solid; border-color:#474a52; display: inline-block; position:absolute; right: 0; top:3.5rem;} .pageNavigation>dl.prev>dt:before{margin:-0.2rem 0 0 0; transform:rotate(45deg);} .pageNavigation>dl.next>dt:before{margin:-0.7rem 0 0 0; transform:rotate(-135deg);} .pageNavigation>dl>dd{padding:0 12.5rem 0 4.5rem;} .pageNavigation>dl>dd>a{max-width:100%; font-weight: 400; color:#333; display:inline-block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .pageNavigation>dl>dd>a:hover{color:var(--point);} .pageNavigation>dl>dd>.day{height:6.5rem; font-weight: 300; color: #666; position: absolute; right:3rem; top:0; display: flex; align-items: center; justify-content: flex-end;} /* Comment Style */ .comment_Area{margin-top:6rem; font-size:0; line-height:0;} .comment_Area input[type=text], .comment_Area input[type=password], .comment_Area textarea{height:4.6rem; margin-right:1.4rem; padding:0 1.5rem; border:1px solid #e2e2e2; font-weight: 300; font-size:1.5rem; line-height:4.4rem; color:#666; vertical-align:middle; display:inline-block;} .comment_Area textarea{width:100%; height:13rem; margin-right:2rem; padding:1.5rem; font-size:1.6rem; line-height:1.6;} .comment_Area *[type=submit]{width:15.5rem; min-width:15.5rem; background-color:#333; border:none; font-weight: 400; font-size:1.8rem; line-height:1; color:#fff; text-align: center; overflow:hidden; display:inline-block; vertical-align: top; box-sizing:border-box; cursor: pointer; position: relative;} .comment_Area .comment_title{padding-bottom:1.8rem; font-size:2rem; line-height:1; color: #1b1b1b;} .comment_Area .comment_write{padding:3rem 2rem; background-color: #fdfdfe; border-top:2px solid var(--btn_c);} .comment_Area .comment_write>div{display: flex; justify-content: space-between;} .comment_Area .comment_write>div.top{flex-direction: row; align-items: end; justify-content: flex-start;} .comment_Area .comment_write>div.btm{margin-top:3rem;} .comment_Area .comment_list{border-bottom:1px solid var(--bor_c);} .comment_Area .comment_list>dl{padding:2.5rem 19.5rem 2.5rem 2rem; border-top:1px solid var(--bor_c); position: relative;} .comment_Area .comment_list>dl>dt{font-size:1.6rem; line-height:1.4; color:#1b1b1b;} .comment_Area .comment_list>dl>dd{margin-top:1rem;} .comment_Area .comment_list>dl>dd p{font-weight: 300; font-size:1.5rem; line-height:1.6; color: #999; display:inline-block; vertical-align: top; position: relative;} .comment_Area .comment_list>dl>dd p+p{margin-left:2.1rem;} .comment_Area .comment_list>dl>dd p+p:before{content: ""; width:1px; height:1rem; margin-top:-0.5rem; background-color: #ccc; display: inline-block; position:absolute; left: -1.1rem; top:50%;} .comment_Area .comment_list>dl>dd .comment_option{position: absolute; right:2rem; top:50%; transform: translateY(-50%); display:inline-block; white-space: nowrap;} .comment_Area .comment_list>dl>dd .comment_option>a{min-width:7.2rem; height:3.6rem; padding:0 2rem; border:1px solid #ccc; font-size:1.5rem; line-height:3.4rem; color: #666; text-align: center; border-radius:3px; display:inline-block; vertical-align: top;} .comment_Area .comment_list>dl>dd .comment_option>a+a{margin-left:1rem;} .comment_Area .comment_list>dl.no_comment{height:20rem; padding:0; color: #999; text-align: center; display: flex; flex-wrap: wrap; flex-direction: row; align-content: center; justify-content: center;} /* Board Write */ .board_write{width:100%; border-top:2px solid #333; border-bottom:1px solid #bdbdbd; overflow:hidden;} .board_write + .board_write{margin-top:6rem;} .board_write>table{width:100%; border-spacing:0; margin-bottom:-1px; table-layout: fixed;} .board_write>table th, .board_write>table td{height:7rem; padding:1.2rem 0 1.2rem 2rem; border-bottom:1px solid #e2e2e2; font-weight: 400; font-size:1.8rem; line-height:1.55; color: #666; text-align:left; vertical-align: middle; border-collapse:collapse; empty-cells:show;} .board_write>table th{width:17rem; padding:0px; background-color:#fbfbfb; border-right:1px solid #e2e2e2; font-weight: 600; color: #111; text-align: center;} .board_write input[type=button], .board_write input[type=text], .board_write input[type=password], .board_write input[type=file], .board_write select, .board_write textarea, .board_write .btns{width:100%; height:5rem; padding:0 1rem; background-color:#fff; border:1px solid #e2e2e2; font-weight: 400; font-size:1.7rem; line-height:4.4rem; color:#888; vertical-align:middle; display:inline-block;} .board_write .small{max-width:52.5rem;} .board_write .minicolors-theme-default.minicolors {width: 100%; max-width:52.5rem;} .board_write .minicolors input[type=hidden] + .minicolors-swatch {width: 100%; background-image:none;} .board_write .minicolors-theme-default .minicolors-swatch{height: 4.6rem;} .board_write select{padding-right:3rem; background-image: url('/theme/prix/img/board/bg_select.svg'); background-repeat: no-repeat; background-position:calc(100% - 1rem) center; background-size: 1.4rem; line-height:4.6rem; -webkit-appearance: none; -moz-appearance: none; appearance: none;} .board_write select::-ms-expand{display:none;} .board_write textarea{width:100%; height:30rem; padding:2rem; line-height:1.6; display:block;} .board_write input[type=text].datetimepicker{background-image:url('/theme/prix/img/board/icon_calendar4.gif') !important; background-repeat:no-repeat !important; background-position:right center !important; background-size:contain;} .board_write input[type=text].datetimepicker.required{background-image:url('../img/require.png'), url('/theme/prix/img/board/icon_calendar4.gif') !important; background-position:right top, right center !important; background-size:auto, contain;} .board_write .board_option{padding-bottom:1rem;} .board_write .btns{width:auto; min-width:fit-content; margin-left:1rem; padding:0 2rem; background-color: #333; border-color:#333; font-weight: 500; color: #fff;} .board_write .btnBox{font-size:0; line-height:0; display: flex; flex-direction: row; align-items: center; align-content: center; justify-content: space-between;} .board_write .btnBox>*{flex:1 1 auto;} .board_write .btnBox>input, .board_write .btnBox>select{} .board_write .two{max-width:43.5%; font-size:0; line-height:0; display: flex; flex-direction: row; align-items: center; justify-content: space-between;} .board_write .three{font-size:0; line-height:0; display: flex; flex-direction: row; align-items: center; justify-content: space-between;} .board_write .three input, .board_write .three select{width:33%;} .board_write .three.birth{max-width:65%;} .board_write .three.phone{max-width:77%;} .board_write .three.phone input{width:36%;} .board_write .three.phone select{width:26%;} .board_write .three.phone select+input{margin-left:-1px;} .board_write .three.days{max-width:60%;} .board_write .three.days .gap, .board_write .three.days input, .board_write .three.days select{width:100%;} .board_write .three.days *+*{margin-left:1rem} .board_write .three.email{max-width:77%;} .board_write .three.email input{width:32%;} .board_write .three.email select{width:35%;} .board_write .three.email input+select{margin-left:1rem;} .board_write .three.email .btns{} .board_write .bo_w_flie>div.script{padding:1rem; border:1px solid #e2e2e2; display: flex; justify-content: flex-start;} .board_write .bo_w_flie>div.script input[type=button]{width:auto; height:3.6rem; padding:0 2rem; background-color: #efefef; border:1px solid #767676; line-height:3.4rem; color: #000;} .board_write .bo_w_flie>div.script>span{margin-left:1rem !important; padding-right:0.2rem; line-height:3.4rem; display:block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} .board_write .juso{margin-top:1rem; font-size:0; line-height:0; display: flex; justify-content: space-between;} .board_write .juso>input{width:40%;} .board_write .juso>input+input{width:60%; margin-left:1rem;} .board_write .checkBox{margin:-1rem 0 0 0; font-size:0; line-height:0; display: flex; flex-wrap: wrap; flex-direction: row; align-items:center; justify-content: flex-start;} .board_write .checkBox>*{margin-top:1rem;} .board_write .checkBox .checkIn{margin-left:0 !important; margin-right: 3rem; vertical-align: middle; white-space: nowrap;} .board_write .checkBox .checkIn label{font-size:1.5rem;} .board_write .checkBox .checkIn input[type=text]{margin-left:1rem; max-width:22rem;} .board_write .checkBox .type{height:2rem; line-height:2rem;} .board_write>table .type{font-size:1.5rem; line-height:1; display:inline-block; vertical-align:middle;} .board_write>table .type.n{white-space: nowrap;} .board_write>table .type.l{margin:0 1.5rem 0 1rem;} .board_write>table .type.r{margin:0 1rem 0 1.5rem;} .board_write>table .type.c{margin:0 1rem;} .board_write>table .point{color: #ff0000;} .board_write>table input[type=password] + .checkIn{margin-left:1rem;} /* Board Write 02 */ .bo_prdt_cart_list{margin-bottom:5rem; display:flex; gap:2rem 4rem; flex-wrap:wrap;} .bo_prdt_cart_list .prdt_it_box{padding:1rem; width:calc((100% - 12rem)/4); display:flex; align-items:center; gap:2rem; background-color:#f7f7f7; border-radius:1rem;} .bo_prdt_cart_list .prdt_it_box .thumb{width:10rem; aspect-ratio:1/1; border-radius:0.5rem; background-color:#fff; overflow:hidden;} .bo_prdt_cart_list .prdt_it_box .thumb img{width:100%; height:100%; object-fit:contain;} .bo_prdt_cart_list .prdt_it_box .info_box .tit{display:block; font-size:2rem; line-height:1.3; font-weight:700; color:#111;} .bo_prdt_cart_list .prdt_it_box .info_box .it_code{margin-top:1rem; font-size:1.8rem; line-height:1.3; font-weight:500; color:#444;} .board_write.design_02{border:none;} .board_write.design_02 .bo_write_tit{padding-bottom:4rem; margin-bottom:5rem; font-size:4.6rem; line-height:1.3; font-weight:700; color:#222; border-bottom:1px solid #e0e0e0;} .board_write.design_02>table tr:first-child td{padding-top:0;} .board_write.design_02>table td{padding:4rem 0 0; border-bottom:none;} .board_write.design_02>table td.half:nth-child(1){padding-right:2.5rem;} .board_write.design_02>table td.half:nth-child(2){padding-left:2.5rem;} .board_write.design_02 .input_tit{margin-bottom:1.5rem; font-size:2.4rem; line-height:1.3; font-weight:600; color:#111;} .board_write.design_02 .input_tit span.required{padding-right:1.2rem; position:relative; background:none !important;} .board_write.design_02 .input_tit span.required::after{content:"*"; display:block; font-size:2rem; color:var(--point); font-weight:400; position:absolute; right:0; top:0;} .board_write.design_02 #captcha #captcha_key, .board_write.design_02 input[type=button], .board_write.design_02 input[type=text], .board_write.design_02 input[type=password], .board_write.design_02 input[type=file], .board_write.design_02 input[type=submit], .board_write.design_02 select, .board_write.design_02 textarea, .board_write.design_02 .btns{padding:2.2rem 2.5rem; height:7rem; font-size:2rem; line-height:1.3; border-radius:1rem; border:1px solid #dfdfdf; overflow:hidden;} .board_write.design_02 select{padding-right:3.5rem; background-position:calc(100% - 2rem) center;} .board_write.design_02 textarea{height:30rem; resize: none; box-shadow:none;} .board_write.design_02 input[type=file]{padding:1.7rem 2.5rem} .board_write.design_02 #captcha #captcha_key, .board_write.design_02 input, .board_write.design_02 select, .board_write.design_02 textarea{background-color:#fff; border:1px solid #dfdfdf; color:#333} .board_write.design_02 input::placeholder, .board_write.design_02 select, .board_write.design_02 textarea::placeholder{color:#888} .board_write.design_02 input[required], .board_write.design_02 textarea[required]{background-image:none !important;} .board_write.design_02 select[required]{background-image:none, url("http://asiafoundation.iceserver.co.kr/images/bg_select_02.svg");} .board_write.design_02 .flex.three{max-width:84rem;} .board_write.design_02>table td.bo_w_flie{padding-bottom:1px;} .board_write.design_02 .file_cus label{display:flex; align-items:center; justify-content:space-between; padding:0.6rem 0.7rem 0.7rem 2rem; font-size:0; background-color:#fff; border:1px solid #dfdfdf; border-radius:1rem; cursor:pointer;} .board_write.design_02 .file_cus label input[type=file]{margin:0; padding:0; width:0; height:0; font-size:0; overflow:hidden; border:none; clip: rect(0 0 0 0);} .board_write.design_02 .file_cus label .file_name{ width:calc(100% - 14.5rem); font-size:2rem; line-height:1.3; font-weight:500; color:#3a3a3a;} .board_write.design_02 .file_cus label .file_btn{width:14.5rem; font-size:2rem; line-height:5.5rem; font-weight:600; color:#fff; text-align:center; border-radius:0.5rem; background-color:var(--point);} .board_write.design_02>table td.half.captcha_td{padding-right:0;} .board_write.design_02 .captcha_Area{max-width:88rem;} .board_write.design_02 .captComment button{vertical-align:top;} .board_write.design_02 .capt_txt{margin-top:1.5rem; font-size:1.8rem; line-height:1.3; color:#111; font-weight:600;} .board_write.design_02 #captcha{width:100%; display:flex; flex-flow:row wrap;} .board_write.design_02 #captcha #captcha_key{width:auto; flex:1; margin:0 1.5rem;} .board_write.design_02 #captcha #captcha_img{border:none; height:5rem;} .board_write.design_02 .captcha_img{padding:1rem; width:22rem; height:7rem; display:inline-block; text-align:center; vertical-align:top; background-color:#f8f8f8; border-radius:1rem;} .board_write.design_02 #captcha #captcha_mp3{margin-right:1.5rem; width:3.6rem; height:7rem; background:url("https://www.needsthem.com/img/captcha_mp3.svg") no-repeat center / contain;} .board_write.design_02 #captcha #captcha_reload{width:3.6rem; height:7rem; background:url("https://www.needsthem.com/img/captcha_reload.svg") no-repeat center / contain;} .board_write.design_02 #captcha.m_captcha audio{margin-bottom:1.5rem; width:100%;} .board_write.design_02 #captcha #captcha_info, .board_write.design_02 #captcha.m_captcha #captcha_info{width:100%; margin-top:3.6rem; font-size:1.8rem; font-weight:600; color:#333;} .board_write.design_02 .three.phone, .board_write.design_02 .three.email{max-width:none;} /* SNS */ .member_connect{margin-top:5rem;} .member_connect .strong{font-size:1.6rem; line-height:3rem; color: #666;} .member_connect .connect-opener{font-weight:bold; font-size:1.8rem; line-height:3rem; color: var(--point);} #sns-link-pnl .connect-close {position:absolute;top:1rem;right:1rem;margin:0;padding:0;width:3rem;height:3rem;border:0;background:transparent;color:#383838;cursor:pointer;font-size:2rem} /*#sns-link-pnl .connect-close:hover {color:#ff5191}*/ #sns-link-pnl .connect-close .fa {margin:0 0 0 1px} #sns-link-pnl .connect-close .txt {position:absolute;line-height:0;font-size:0;overflow:hidden} #sns-link-pnl #login_fs {margin:0 auto;width:100%;text-align:left} #sns-link-pnl #login_fs label {display:block;font-size:14px; color:#7a7a7a;margin:1.5rem 0 0.5rem} #sns-link-pnl #login_fs .frm_input{font-size:14px;} #sns-link-pnl #login_fs .lg_id,#sns-link-pnl #login_fs .lg_pw {width:100%;margin-bottom:1rem;} #sns-link-pnl #login_id,#sns-link-pnl #login_pw {width:100%} #sns-link-pnl #login_fs .login_submit {width:100%;height:44px;font-size:2rem;color: var(--point); margin:10px auto 0;font-weight:bold;cursor:pointer;display:block} #sns-link-pnl .connect-fg {height:320px;text-align:left} #sns-link-pnl .login_fs {margin:0 auto;width:260px} #sns-link-pnl .connect-fg .connect-desc {margin:0 0 10px;padding:15px;border:1px solid #ccc;background:#fafafa;color:#666; font-size:1.4rem; line-height:1.6;} #sns-link-pnl .connect-fg .connect-title {margin-top:25px;margin-bottom:10px;font-size:2.4rem;font-weight:bold;text-align:center} .board_write>table .sns-wrap{margin:-1rem 0 0 -2rem; display: flex;} .board_write>table .sns-wrap .sns-icon {height:3.2rem; margin:1rem 0 0 2rem; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; -ms-flex-align:center; overflow:hidden;} .board_write>table .sns-wrap .sns-icon .ico{width:3.2rem; height:3.2rem; background-color: #fff; background-repeat: no-repeat; background-position: center center; background-size: cover;} .board_write>table .sns-wrap .sns-icon .txt{padding:0 0 0.2rem 0.8rem; font-weight: 500; font-size:1.5rem; line-height:1; color: #222;} .board_write>table .sns-wrap .sns-icon .txt i{font-style: normal;} .board_write>table .sns-wrap .sns-icon.sns-naver {} .board_write>table .sns-wrap .sns-icon.sns-naver .ico{background-image:url('../img/icon_sns_naver2.png');} .board_write>table .sns-wrap .sns-icon.sns-naver .txt i{color: #2cb400;} .board_write>table .sns-wrap .sns-icon.sns-kakao {} .board_write>table .sns-wrap .sns-icon.sns-kakao .ico{background-image:url('../img/icon_sns_kakao2.png');} .board_write>table .sns-wrap .sns-icon.sns-kakao .txt i{color: #ecd708;} .board_write>table .sns-wrap .sns-icon.sns-facebook {} .board_write>table .sns-wrap .sns-icon.sns-facebook .ico{background-image:url('../img/icon_sns_facebook2.png');} .board_write>table .sns-wrap .sns-icon.sns-facebook .txt i{color: #004a93;} .board_write>table .sns-wrap .sns-icon.sns-icon-not{filter:grayscale(100%); opacity: 0.7;} .board_write>table .sns-wrap .sns-icon.sns-icon-not .txt, .board_write>table .sns-wrap .sns-icon.sns-icon-not .txt i{color: #666 !important;} /* Faq List */ .faqArea{width:100%; border-top:2px solid var(--btn_c); font-size:0; line-height:0; position:relative; overflow:hidden;} .faqArea>li{border-bottom:1px solid var(--bor_c); position: relative;} .faqArea>li+li{} .faqArea>li .q{padding:2.5rem 8rem; font-weight: 600; font-size:1.6rem; line-height:2.8rem; color: #1b1b1b; display:block; position: relative;} .faqArea>li .q:before{content: "Q"; width:3.6rem; height:3.6rem; background-color: var(--btn_c); font-size:2rem; line-height:1.2; color: #fff; text-align: center; display: flex; align-items: center; justify-content: center; position:absolute; left: 2.5rem; top:2.1rem; border-radius:0.3rem;} .faqArea>li .q:after{content: "↓"; font-weight: 500; font-size:2rem; line-height:1.2; color: #111; text-align: center; position:absolute; right: 4rem; top:50%; transform: translateY(-50%); font-family:"SUIT Variable", sans-serif !important;} .faqArea>li .q:hover{} .faqArea>li .a{padding:2.5rem 8rem; background-color: #fafbfd; border-top:1px solid var(--bor_c); font-weight: 400; font-size:1.6rem; line-height:2.7rem; color: #626262; display:none; position: relative;} .faqArea>li .a>p{font-weight: 400; font-size:1.6rem; line-height:2.7rem;} .faqArea>li .a:before{content: "A"; width:3.6rem; height:3.6rem; background-color: #fff; border:1px solid #c6c6c6; font-weight: 500; font-size:2rem; line-height:1.2; color:var(--btn_c); text-align: center; display: flex; align-items: center; justify-content: center; position:absolute; left: 2.5rem; top:2.1rem; border-radius:0.3rem;} .faqArea>li .view_file{margin-top:2rem;} .faqArea>li.active .q{} .faqArea>li.active .q:before{} .faqArea>li.active .q:after{transform:translateY(-50%) rotate(-180deg);}/* color: var(--point); */ .faqArea>li.noPost{width:100%; height:30rem; font-size:1.6rem; line-height:1; color: #666; text-align: center; display:table;} .faqArea>li.noPost>p{display:table-cell; vertical-align: middle;} .faqArea>li.ad{padding-top:3rem;} /* Photo List */ .photo_list{width:100%; font-size:0; line-height:0; position: relative;} .photo_list ul.list{text-align: left; display: flex; flex-flow: row wrap; gap:8rem 4.5rem;} .photo_list ul.list li{width:calc((100% - 13.5rem) / 4); position: relative;} .photo_list ul.list li .gall_cont{width:100%; background-color: #fff; display:block; position: relative;} .photo_list ul.list li .gall_cont .thumb{width:100%; border-radius:1rem; aspect-ratio: 396/297; display:block; overflow:hidden; position: relative;} .photo_list ul.list li .gall_cont .thumb img{width:100%; max-width:none; height:100%; object-fit:cover; vertical-align: top; transition: all .7s ease-out;} .photo_list ul.list li .gall_cont p.over{width:100%; height:100%; background-color: rgba(0,0,0,0.3); position: absolute; left:0; top:0; opacity: 0; z-index:1; z-index:3;} .photo_list ul.list li .gall_cont p.over:before, .photo_list ul.list li .gall_cont p.over:after{content: ""; background-color: #fff; display: inline-block; position:absolute; left: 50%; top:50%; opacity: 0;} .photo_list ul.list li .gall_cont p.over:before{width: 100px; height: 1px; margin:-0.5px 0 0 -50px;} .photo_list ul.list li .gall_cont p.over:after{width: 1px; height: 100px; margin:-50px 0 0 -0.5px;} .photo_list ul.list li .gall_cont p.over>span{width:100%; font-weight: 300; font-size:1.5rem; line-height:1; color: #fff; text-align: center; position: absolute; left:0; top:65%; opacity: 0;} .photo_list ul.list li .gall_cont p.over.move{transition: all 0s ease-out; opacity: 1; display:none;} .photo_list ul.list li .gall_cont .area{width:100%; padding:2rem 1rem 0; display: flex; flex-flow: column wrap; position: relative;} .photo_list ul.list li .gall_cont .area .tt{width:100%; font-size:1.8rem; line-height:2.6rem; color: #666; display: block; overflow:hidden; position: relative; word-break:keep-all; word-wrap:break-word; word-break:break-all;} .photo_list ul.list li .gall_cont .area .title{width:100%; font-weight: 600; font-size:2rem; color: #333; display: inline-flex; align-items: center; gap:1rem;} .photo_list ul.list li .gall_cont .area .title.tac{justify-content: center;} .photo_list ul.list li .gall_cont .area .title .icon{} .photo_list ul.list li .gall_cont .area .title .icon:before{content: ""; width:1.8rem; height:1.8rem; background-color: var(--btn_c); font-weight: 300; font-size:1rem; line-height:1.8rem; color: #fff; letter-spacing: 1px; text-align: center; border-radius:99px; display:block;} .photo_list ul.list li .gall_cont .area .title .icon.new:before{content: "N";} .photo_list ul.list li .gall_cont .area .title .icon.hot:before{content: "H";} .photo_list ul.list li .gall_cont .area .cate{margin-bottom:0.5rem; font-size:1.6rem; color: #999;} .photo_list ul.list li .gall_cont .area .cate_second{font-size:1.6rem; line-height:1.3; font-weight:500; color:#222;} .photo_list ul.list li .gall_cont .area .txt{margin-top:1rem; font-size:1.6rem; line-height:1.3; font-weight:500; color:#888;} .photo_list ul.list li .gall_cont .area .day{margin-top:2rem; font-size:1.6rem; color: #999; position: absolute; left:0; bottom:2rem;} .photo_list ul.list li .gall_cont .area .btns{margin-top:2.5rem; display: flex; justify-content: center;} .photo_list ul.list li .gall_cont .area .btns>*{height:4rem; padding:0 2rem; background-color: #666; font-size:1.4rem; line-height:1; color: #fff; text-align: center; display: inline-flex; align-items: center; justify-content: center; gap:0.7rem; white-space: nowrap; border-radius:0.3rem; box-shadow:0 0 2rem rgba(0,0,0,0.1); transition: all .3s ease-out;} .photo_list ul.list li .gall_cont .area .btns.down img{width:1.5rem;} .photo_list ul.list li .gall_cont:hover .area .btns *{background-color: var(--point);} .photo_list ul.list li .gall_cont .category{display: flex; justify-content: center; position: relative; z-index:4;} .photo_list ul.list li .gall_cont .category p{width:9.2rem; height:3.4rem; margin-top:-5.4rem; background-color: #7030a0; font-size:1.5rem; line-height:1; color: #fff; text-align: center; border-radius:99px; display: flex; align-items: center; justify-content: center;} .photo_list ul.list li .gall_cont .category p.video{background-color: #00a5bb;} .photo_list ul.list li .gall_cont .area .state{margin-bottom:1.5rem;} .photo_list ul.list li .gall_cont .area .state .icon{width:8rem; height:3.5rem; background-color: var(--point); border:1px solid var(--point); font-size:1.5rem; line-height:1; color: #fff; text-align: center; display: inline-flex; align-items: center; justify-content: center; border-radius:99px;} .photo_list ul.list li .gall_cont .area .state .icon.end{background-color: #ddd; border-color: var(--bor_c); color: #666;} .photo_list ul.list li .gall_cont .area .one{display: -webkit-box; text-overflow: ellipsis; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; word-break:break-all !important;} .photo_list ul.list li .gall_cont .area .two{max-height:5.2rem; display: -webkit-box; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break:break-all !important;} .photo_list ul.list li .gall_cont .area .three{max-height:7.6rem; display: -webkit-box; text-overflow: ellipsis; -webkit-line-clamp: 3; -webkit-box-orient: vertical; word-break:break-all !important;} .photo_list button.more{width:23rem; height:5.4rem; margin:7rem auto 0; padding:0; border:1px solid #aaa; font-weight: 700; font-size:1.8rem; line-height:1; color: var(--point); text-align: center; position: relative; cursor: pointer; display:block; border-radius:99px;} .photo_list button.more:after{content: "↓"; font-weight: normal; font-size:1.5rem; color: #999; position:absolute; right: 3rem; top:50%; transform: translateY(-50%);} /* 가로 모드 */ .photo_list.landscape{border-top:2px solid #333; border-bottom:1px solid #aaa; overflow:hidden;} .photo_list.landscape ul.list{margin:0 0 -1px 0;} .photo_list.landscape ul.list li{width:100%; padding:5rem 2rem; border-bottom:1px solid #ccc;} .photo_list.landscape ul.list li .gall_box{left:2rem; top:5rem;} .photo_list.landscape ul.list li .gall_cont{border:none; display: flex; flex-flow: row nowrap; align-items: center; justify-content: space-between; box-shadow:none !important; word-break:break-all;} .photo_list.landscape ul.list li .gall_cont .thumb{width:100%; max-width:39.6rem; border-radius:1rem; aspect-ratio:396/297; display:block; overflow:hidden;} .photo_list.landscape ul.list li .gall_cont .thumb img{object-fit:contain; position:absolute; left:0; top:0;} .photo_list.landscape ul.list li .gall_cont .area{width:100%; padding:0 0 0 5rem;} .photo_list.landscape ul.list li .gall_cont .area .in_area{height:auto; padding:0; text-align: left;} .photo_list.landscape ul.list li .gall_cont .area .in_area .tt{font-size:1.7rem; line-height:2.4rem;} .photo_list.landscape ul.list li .gall_cont .area .in_area .title{font-size:2.4rem;} .photo_list.landscape ul.list li .gall_cont .area .in_area .txt{margin-top:2rem;} .photo_list.landscape ul.list li .gall_cont .area .in_area .sBay{margin-top:4.5rem;} .photo_list.landscape ul.list li .gall_cont .area .in_area .sBay p{font-size:1.6rem; color: #666;} .photo_list.landscape ul.list li .gall_cont .area .in_area .two{max-height:4.8rem;} .photo_list.landscape ul.list li .gall_cont .area .in_area .three{max-height:7.2rem;} /* 이벤트 (가로) */ .photo_list.event{border-top:2px solid var(--btn_c); border-bottom:1px solid var(--bor_c);} .photo_list.event ul.list{flex-flow: column wrap; gap:0;} .photo_list.event ul.list li{width:100%; padding:4rem 0;} .photo_list.event ul.list li+li{border-top:1px solid var(--bor_c);} .photo_list.event ul.list li .gall_cont{display: flex; flex-flow: row wrap; gap:5rem;} .photo_list.event ul.list li .gall_cont .thumb{width:21rem;} .photo_list.event ul.list li .gall_cont .area{width:calc(100% - 26rem);} .photo_list.event ul.list li .gall_cont .area .e_icon{margin-top:1.5rem;} .photo_list.event ul.list li .gall_cont .area .e_icon>span{width:10rem; height:3rem; background-color: #fff; border:1px solid #035ab6; line-height:2.8rem; color:#035ab6; text-align: center; display: block; border-radius:99px;} .photo_list.event ul.list li .gall_cont .area .e_icon.ing>span{background-color:#035ab6; border-color:#035ab6; color: #fff;} .photo_list.event ul.list li .gall_cont .area .e_icon.end>span{background-color:#b3b3b3; border-color:#b3b3b3; color: #fff;} /* newsletter */ .photo_list.newsletter{} .photo_list.newsletter ul.list{gap:4rem 7rem;} .photo_list.newsletter ul.list li{width:calc((100% - 14rem) / 3);} .photo_list.newsletter ul.list li .gall_cont{background-color: transparent;} .photo_list.newsletter ul.list li .gall_cont .thumb{aspect-ratio: 1/1.29; transition: all .3s ease-out;} .photo_list.newsletter ul.list li .gall_cont .thumb:before{content: ""; border:0 solid #00a8bf; position:absolute; left: -1px; top:-1px; right:-1px; bottom:-1px; box-sizing: border-box; z-index:3; transition: all .3s ease-out; display:none !important;} .photo_list.newsletter ul.list li .gall_cont .over{display:none !important;} .photo_list.newsletter ul.list li .gall_cont .area{min-height:auto; padding:3.5rem 0;} .photo_list.newsletter ul.list li .gall_cont:hover .thumb{box-shadow:0 0 3rem rgba(0,0,0,0.1); border-color:#00a8bf;} .photo_list.newsletter ul.list li .gall_cont:hover .thumb:before{border-width:1px;} .photo_list.newsletter.swiper-initialized ul.list{padding-bottom:2.5rem; gap:0rem; flex-wrap: nowrap; } html.main .photo_list.newsletter ul.list li{width:38rem; min-width:38rem;} .photo_list.recipe ul.list li .gall_cont .thumb{aspect-ratio: 1/1.40263;} /* cooking */ .photo_list.cooking ul.list{gap:4rem;} .photo_list.cooking ul.list li{width:calc((100% - 8rem) / 3);} .photo_list.cooking ul.list li .gall_cont .thumb{aspect-ratio: 1.6/0.9;} .photo_list.cooking ul.list li .gall_cont .area{min-height:5.2rem; padding:2rem 0; } .photo_list.cooking ul.list li .gall_cont .area .title{font-weight: 400; justify-content: center; text-align: center;} /* store */ .photo_list.store{margin-top:4rem;} .photo_list.store ul.list{gap:4rem;} .photo_list.store ul.list li{width:calc((100% - 12rem) / 4);} .photo_list.store ul.list li .gall_cont .thumb{border:1px solid var(--bor_c); aspect-ratio: 1.6/0.6511;} /* event */ .photo_list.events{} .photo_list.events ul.list{gap:2rem 7rem;} .photo_list.events ul.list li{width:calc((100% - 14rem) / 3);} .photo_list.events ul.list li .gall_cont{background-color: transparent;} .photo_list.events ul.list li .gall_cont .area{min-height:auto; padding:2rem 0;} .photo_list.events ul.list li .gall_cont .area .day{margin-top:0.5rem; text-align: center; position: static;} .photo_list.events ul.list li .gall_cont .area .state{margin:1.5rem 0 0 0; text-align: center;} /* 인증서 */ .photo_list.certified{} .photo_list.certified ul.list{gap:2rem 4rem;} .photo_list.certified ul.list li{width:calc((100% - 12rem) / 4);} .photo_list.certified ul.list li .gall_cont .thumb{aspect-ratio: 250/353; padding:0.9rem;} /* 동영상 */ .photo_list.movie{} .photo_list.movie ul.list{gap:2rem 6rem;} .photo_list.movie ul.list li{width:calc((100% - 12rem) / 3);} .photo_list.movie ul.list li .gall_cont .thumb{aspect-ratio: 360/240;} .photo_list.movie ul.list li .gall_cont p.over{background: rgba(0,0,0,0.3) url('/images/main/btn_play.png') no-repeat center center / 8rem;} .photo_list.movie ul.list li .gall_cont p.over:before, .photo_list.movie ul.list li .gall_cont p.over:after, .photo_list.movie ul.list li .gall_cont p.over>span{display:none;} .photo_list.movie ul.list li .gall_cont .area{min-height:auto; padding-bottom:2rem;} /* 주요거래처 */ .photo_list.client{} .photo_list.client ul.list{gap:2rem;} .photo_list.client ul.list li{width:calc((100% - 6rem) / 4);} .photo_list.client ul.list li .gall_cont .thumb{aspect-ratio: 283/99;} .photo_list.client ul.list li .gall_cont .thumb img{object-fit: contain;} .photo_list.client ul.list li .gall_cont .area{min-height:auto; padding-bottom:1.5rem;} /* 제조설비 */ .photo_list.Facilities{} .photo_list.Facilities ul.list{gap:1.5rem 4rem;} .photo_list.Facilities ul.list li{width:calc((100% - 12rem) / 4);} .photo_list.Facilities ul.list li .gall_cont .thumb{aspect-ratio: 270/180;} .photo_list.Facilities ul.list li .gall_cont .area{min-height:auto; padding-bottom:1rem;} /* 제품소개 */ .photo_list.product{} .photo_list.product ul.list{gap:6rem 15.1rem;} .photo_list.product ul.list li{width:calc((100% - 30.2rem) / 3);} .photo_list.product ul.list li .gall_cont .thumb{aspect-ratio: 386/290; border:0; border-radius:1rem; overflow:hidden;} .photo_list.product ul.list li .gall_cont .thumb .ico_vr360{display:flex; align-items:center; justify-content:center; text-align:center; width:5.2rem; height:5.2rem; text-align:center; position:absolute; right:1.2rem; bottom:1.2rem; background-color:rgba(98, 186, 70, 0.7); border-radius:50%;} .photo_list.product ul.list li .gall_cont .thumb .ico_vr360 img{width:3.9rem; height:auto;} .photo_list.product ul.list li .gall_cont .thumb .view_ico_box{width:3.4rem; height:3.4rem; background-color:#fff; border-radius:50%; box-shadow:0 0.2rem 0.5rem 0 rgba(0, 0, 0, 0.15); position:absolute; right:2rem; top:2rem;} .photo_list.product ul.list li .gall_cont .thumb .view_ico_box::before, .photo_list.product ul.list li .gall_cont .thumb .view_ico_box::after{content:""; display:block; margin:-0.1rem 0 0 -0.7rem; width:1.4rem; height:0.2rem; background-color:var(--point); position:absolute; left:50%; top:50%;} .photo_list.product ul.list li .gall_cont .thumb .view_ico_box::after{transform:rotate(90deg);} .photo_list.product ul.list li .gall_cont .area{min-height:auto; padding:2rem 1rem 0;} .photo_list.product ul.list li .gall_cont .cate_second{font-size:1.6rem; line-height:1.3; font-weight:500; color:#222;} .photo_list.product ul.list li .gall_cont .txt{margin-top:1rem; font-size:1.6rem; line-height:1.3; font-weight:500; color:#888;} /* 시공사례 */ .photo_list.portfolio{} .photo_list.portfolio ul.list{gap:6rem 15.1rem;} .photo_list.portfolio ul.list li{width:calc((100% - 30.2rem) / 3);} .photo_list.portfolio ul.list li .gall_cont .thumb{aspect-ratio: 385/218; border:0; border-radius:1rem; overflow:hidden;;} .photo_list.portfolio ul.list li .gall_cont .area{min-height:auto; padding:2rem 1rem 0;} .photo_list.portfolio ul.list li .gall_cont .cate_second{font-size:1.6rem; line-height:1.3; font-weight:500; color:#222;} .photo_list.portfolio ul.list li .gall_cont .txt{margin-top:1rem; font-size:1.6rem; line-height:1.3; font-weight:500; color:#888;} .photo_list ul.list li a.gall_cont:hover .thumb img{transform: scale(1.05);} .photo_list ul.list li a.gall_cont:hover p.over{opacity: 1;} .photo_list ul.list li a.gall_cont:hover p.over:before{width: 28px; margin-left:-14px; opacity: 1;} .photo_list ul.list li a.gall_cont:hover p.over:after{height: 28px; margin-top:-14px; opacity: 1;} .photo_list ul.list li a.gall_cont:hover p.over>span{top:60%; opacity: 1;} .photo_list ul.list li.noPost{width:100%; height:30rem; padding:0; border-top:2px solid var(--btn_c); border-bottom:1px solid var(--bor_c); font-size:1.6rem; line-height:1; color: #666; text-align: center; display: flex; align-items: center; justify-content: center;} /* 매장 찾기 */ .storeMapType2{width:100%; position: relative; display: flex; justify-content: space-between;} .storeMapType2 .storeMap_list{width:34rem; min-width:34rem; height:70rem; border:1px solid #ddd; border-right:0; overflow:hidden; overflow-y:scroll; order:2;} .storeMapType2 .storeMap_list>li{position: relative;} .storeMapType2 .storeMap_list>li .checkIn.noTxt{position: absolute; left:1rem; top:1rem;} .storeMapType2 .storeMap_list>li .admGos{position: absolute; right:1rem; top:0.6rem;} .storeMapType2 .storeMap_list>li+li{border-top:1px solid #ddd;} .storeMapType2 .storeMap_list>li.noPost{height:100%; font-weight: 400; font-size: 1.6rem; line-height:1.5; color: #666; display: flex; flex-wrap: wrap; flex-direction: row; align-items: center; justify-content: center;} .storeMapType2 .storeMap_list .link{padding:3.5rem 2.5rem; display:block;} .storeMapType2 .storeMap_list .link .title{padding-right:2.6rem; font-weight: 500; font-size: 2rem; line-height:1.5; color: #000; display: flex; justify-content: space-between; position: relative;} .storeMapType2 .storeMap_list .link .title:after{content: "\e724"; font-family: 'fontello'; font-size: 1.3em; color: var(--point); position: absolute; right:0; top:50%; transform: translateY(-50%);} .storeMapType2 .storeMap_list .link .text{margin-top:1rem; font-size:1.6rem; line-height:1.5; color: #666;} .storeMapType2 .storeMap_list .link .btns{margin-top:1.5rem;} .storeMapType2 .storeMap_list .link .btns>span{width:11rem; height:3.6rem; background-color: #fff; border:1px solid #dadada; font-size:1.5rem; line-height:3.4rem; color: #666; display: flex; flex-wrap: wrap; flex-direction: row; align-content: center; justify-content: center;} .storeMapType2 .storeMap_list .link.open, .storeMapType2 .storeMap_list .link:hover{background-color: #f4f4f4;} .storeMapType2 #storeMap{height:70rem; margin-bottom:0; order:1;} .storeFancyLay{width: 100%; max-width:1280px !important; margin:0 auto; padding:5rem !important; font-size:1.6rem; line-height:1.6; color:#555; box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23); display: none; overflow: visible !important;} .storeFancyLay .store_view{padding-bottom:4rem;} .storeFancyLay #storeLayMap{margin-bottom:0;} .storeFancyLay .store_view .left_box{border:none;} .storeFancyLay .storePhoto .store-big .slider{min-height:30rem;} .storeFancyLay .store_info{width:100%; height:100%; border-top:1px solid #333; font-size:0; line-height:0; border-spacing:0; table-layout : fixed;} .storeFancyLay .store_info th, .storeFancyLay .store_info td{height:6rem; padding:1.2rem 0 1.2rem 3rem; background-color: #fff; border-bottom:1px solid #dadada; font-size:1.8rem; line-height:1.5; color:#666; text-align:left; vertical-align: middle; border-collapse:collapse; empty-cells:show; box-sizing: border-box; word-break:keep-all; word-wrap:break-word;} .storeFancyLay .store_info th{width:15rem; background-color: var(--point); font-weight: 600; color: #fff;} .storeFancyLay .fancybox-button.fancybox-close-small{padding:0.5rem; background-color:rgba(0,0,0,0.7); color: #fff; right: -2.2rem; top: -2.2rem; border-radius: 99px; opacity: 1 !important;} @media only screen and (max-width : 1480px){ .storeFancyLay{width:calc(100% - 6rem);} } @media only screen and (max-width : 1280px){ /* Photo List */ /* 제품소개 */ .photo_list.product ul.list{gap:6rem 6rem} .photo_list.product ul.list li{width:calc((100% - 12rem)/3);} /* 시공사례 */ .photo_list.portfolio ul.list{gap:6rem 6rem} .photo_list.portfolio ul.list li{width:calc((100% - 12rem)/3);} } @media only screen and (max-width : 1024px){ /* Board List Check Style */ .bo_list_wrap .bo_cate_chk{display:none; padding-top:11rem; flex-direction:column; position:fixed; left:0; top:0; z-index:10; width:100%; height:100vh; background-color:#fff;} .bo_list_wrap .bo_cate_chk.open{display:flex;} .bo_list_wrap .bo_cate_chk .cate_filter_ul{display:flex; margin:0 auto; width:calc(100% - 6rem);} .category_chk{flex:1; width:100%; border:0; overflow-y:auto;} .category_chk .btn_cate_op{padding:3rem 3rem 2rem;} .category_chk .btn_cate_op::before{display:none;} .category_chk .cate_ul_chk{display:block; padding:3rem} .bo_list_wrap .bo_list_top .mo_cate_open_btn{display:flex;} .bo_list_wrap .bo_list_top .board_btn{display:none;} .mo_filter_submit{display:block;} /* Board View */ /* 제품 상세 */ .product_view{display: block;} .product_view .left_box{max-width:none; width:100%;} .product_view .right_box{margin:6rem 0 0 0; max-width:none; width:100%;} .product_view .productText .view-scroll{max-height:none; overflow: visible;} /* 시공 상세 */ .portfolio_view{display: block;} .portfolio_view .left_box{max-width:none; width:100%;} /* .portfolio_view .right_box{margin:6rem 0 0 0; max-width:none; width:100%; aspect-ratio:unset;} .portfolio_view .productText .view-scroll{max-height:none; overflow: visible;} .portfolio_view .portfolio_map{height:30rem;} */ .portfolio_view_btm .cont_wr{flex-direction:column-reverse;} .portfolio_view_btm .cont_wr .cont_area{flex:none; width:100%;} .portfolio_view_btm .cont_wr .map_box{max-width:none; width:100%; height:55rem;} /* Board Write */ .board_write .small{max-width:100%;} .board_write .three.days, .board_write .three.phone, .board_write .three.email{max-width:100%;} .board_write .minicolors-theme-default.minicolors {max-width:100%;} /* Board Write 02 */ /* Photo List */ .photo_list ul.list li{width:calc((100% - 6rem) / 3);} /* newsletter */ .photo_list.newsletter{} .photo_list.newsletter ul.list{gap:4rem;} .photo_list.newsletter ul.list li{width:calc((100% - 8rem) / 2);} /* store */ .photo_list.store ul.list li{width:calc((100% - 8rem) / 2);} /* cooking */ .photo_list.cooking ul.list li{width:calc((100% - 8rem) / 2);} /* 주요거래처 */ .photo_list.client ul.list li{width:calc((100% - 4rem) / 3);} /* 제품소개 */ .photo_list.product{} .photo_list.product ul.list{gap:4rem 4rem;} .photo_list.product ul.list li{width:calc((100% - 8rem) / 3);} /* 시공사례 */ .photo_list.portfolio{} .photo_list.portfolio ul.list{gap:4rem 4rem;} .photo_list.portfolio ul.list li{width:calc((100% - 8rem) / 3);} .photo_list ul.list li.noPost{width:100%;} /* Store2 */ .storeMapType2{display:block;} .storeMapType2 .storeMap_list{width:100%; min-width:auto; height:40rem; border-right:1px solid #ddd;} .storeMapType2 .storeMap_list>li{} .storeMapType2 .storeMap_list>li .checkIn.noTxt{} .storeMapType2 .storeMap_list>li .admGos{} .storeMapType2 .storeMap_list>li+li{} .storeMapType2 .storeMap_list .link{} .storeMapType2 .storeMap_list .link .title{} .storeMapType2 .storeMap_list .link .text{} .storeMapType2 .storeMap_list .link .btns{} .storeMapType2 .storeMap_list .link .btns>span{width:100%;} .storeMapType2 .storeMap_list .link:hover{} .storeMapType2 #storeMap{height:40rem;} .storeFancyLay{padding:2rem !important;} .storeFancyLay .store_view .left_box{margin-top:3rem;} } @media only screen and (max-width : 840px){ /* Input Style */ input[type=button], input[type=text], input[type=password], input[type=file], input[type=submit], select, textarea, .board_write .btns{height:7rem; font-size:2rem; line-height:6.8rem;} select{padding-right:4rem; background-position: calc(100% - 1rem) center; background-size: 2rem; line-height:7rem;} textarea{height:30rem; line-height:1.55;} input[required], textarea[required]{background-image:url('/images/require.png'); background-repeat:no-repeat; background-position:right top} select[required]{background-image:url('/images/require.png'), url('/images/bg_select.svg'); background-repeat:no-repeat; background-position:right top, calc(100% - 1rem) center; background-size:2rem;} /* Check New Style */ .check-new{} .check-new input[type=checkbox]+label, .check-new input[type=radio]+label{font-size:2.2rem; line-height:2.4rem;} .check-new input[type=checkbox]+label>.graphic, .check-new input[type=checkbox]+label>.graphic:before, .check-new input[type=radio]+label>.graphic, .check-new input[type=radio]+label>.graphic:before{width: 2.6rem; height: 2.6rem;} .check-new input[type=radio]+label>.graphic:before{width: 60%; height: 60%;} /* Clause Box Style */ .clauseArea>.tit{font-size:2.2rem;} .clauseArea .scroll{height:30rem; font-size:2rem;} .clauseArea .scroll>p{} .clauseArea .scroll>p>strong{font-size:2.2rem;} .clauseArea .scroll ol>li{margin-left:-0.5rem; padding-left:3.3rem; position: relative; box-sizing:border-box;} .clauseArea .scroll ol>li:before {width:2.5rem;} .clauseArea .scroll ul.bul>li{position: relative;} .clauseArea .scroll ul.bul>li:before{} .clauseArea .scroll ul.circle>li{padding-left:1.5rem; position: relative;} .clauseArea .scroll ul.circle>li:before{content: "ο"; display: inline-block; position:absolute; left: 0; top:-1px;} /* Search Style */ .board_search{margin-bottom:0rem;} .board_search .mobile_Block{width:100%; position: absolute; left:0; top:0; display: flex; justify-content: space-between;} .board_search *+*{} .board_search select, .board_search input[type=text], .board_search input[type=submit]{height:8rem; font-size:2.2rem; line-height:7.8rem;} .board_search select{padding:0 3.5rem 0 1rem; background-size: 2rem;} .board_search input[type=text]{width:100%;} .board_search input[type=submit]{min-width:12rem; font-size:2.2rem;} .board_search.store2{padding-top:9rem; justify-content: space-between;} .board_search.store2 *+*{margin-left:0;} .board_search.store2 select+select{margin-left:2rem;} .board_search.store2 select{width:50%;} .board_search.divide{flex-wrap: wrap;} .board_search.divide *+*{margin-left:0;} .board_search.divide select+select{margin-left:2rem;} .board_search.divide select{width:calc(50% - 1rem);} .board_search.divide .mflex{width:100%; margin-top:2rem; display: flex; justify-content: space-between;} /* Category Style */ .category_top{} .category_top h2{font-size:2.4rem; display: flex;} .category_top>ul{width:100%; margin:0; background-color: #fff; border:1px solid #ddd; display: none; position: absolute; left:0; top:calc(100% - 1px);} .category_top>ul>li{margin:0; display:block;} .category_top>ul>li+li{border-top:1px solid #ddd;} .category_top>ul>li a{height:7.5rem; border:none; font-size:2.2rem; text-align: left; white-space: normal; border-radius:0; justify-content: flex-start;} .category_top>ul>li a>span{} .category_top.open h2:after{transform:rotate(-45deg);} .category_top.open h2:before{transform:rotate(45deg);} .category-depth3>li{} .category-depth3>li>a{font-size:2.2rem;} /* Search Result */ .search-result{} .search-result h2{font-size:2.2rem; display: flex;} .search-result>ul{width:100%; margin:0; background-color: #fff; border:1px solid #ddd; display: none; position: absolute; left:0; top:calc(100% - 1px);} .search-result>ul>li{margin:0; display:block;} .search-result>ul>li+li{border-top:1px solid #ddd;} .search-result>ul>li a{height:6.5rem; border:none; font-size:2rem; text-align: left; white-space: normal; border-radius:0; justify-content: flex-start;} .search-result>ul>li a>span{width:2.6rem; height:2.6rem; font-size:1.6rem; line-height:2.6rem;} .search-result.open h2:after{transform:rotate(-45deg);} .search-result.open h2:before{transform:rotate(45deg);} /* Board Option */ .board_btn{padding:3rem 0;} .board_btn>*{} .board_btn>.total{font-size:2rem;} .board_btn>.total>strong{} .board_btn .click{font-size:2.2rem;} .board_btn .click .fa{} .board_btn .click .fa.fa-pencil{} .board_btn .click.big{min-width:15rem; padding:1.8rem 2.5rem; font-size:2.4rem;} .board_btn.write .board_user{width:calc(100% + 2rem); margin:-1rem; display: flex; flex-flow: row wrap; justify-content: space-between;} .board_btn.write .board_user>li{flex:1 1 30%; margin:1rem !important;} .board_btn.write .click.big{width:100%; min-width:auto; padding:1.8rem 2.5rem;} /* Category Style */ .multi-tab{} .multi-tab .name{font-size:2.2rem; display: flex;} .multi-tab ul.multi-list{width:100%; margin:0; background-color: #fff; border:1px solid #ddd; display: none; position: absolute; left:0; top:calc(100% - 1px); z-index:3;} .multi-tab ul.multi-list>li{width:100%; max-width:100%; margin:0; display:block;} .multi-tab ul.multi-list>li+li{border-top:1px solid #ddd;} .multi-tab ul.multi-list>li a{height:6.5rem; border:none; font-size:2rem; text-align: left; white-space: normal; border-radius:0; justify-content: flex-start;} .multi-tab ul.multi-list>li a>span{} .multi-tab ul.multi-list .radius{display:none !important;} .multi-tab ul.multi-list>li:is(:hover, .active) a{background-color:var(--point); border-color:var(--point); color:#fff;} .multi-tab.open .name:after{transform:rotate(-45deg);} .multi-tab.open .name:before{transform:rotate(45deg);} /* Board List Style */ .board-total{font-size:2.2rem;} .board_list{} .board_list>table{} .board_list>table, .board_list>table tbody, .board_list>table tr, .board_list>table td, .board_list>table th{padding:0; background-color: #fff; border:none; font-size:2.2rem; display:block;} .board_list>table .td_num2, .board_list>table>thead{display:none;} .board_list>table .td_chk{width:auto; margin:-1rem 0 1rem; text-align: left; font-size:0; line-height:0;} .board_list>table tr{padding:3rem 2rem; border-bottom:1px solid #e2e2e2;} .board_list>table tr.notis{padding:3rem 2rem; background-color: #f4f4f4;} .board_list>table tr+tr{} .board_list>table>thead>tr>th{} .board_list>table .notice_icon{font-size:1.6rem;} .board_list>table .td_subject>a{font-weight: 600; font-size:2.4rem; -webkit-line-clamp: 2;} .board_list>table .btm{margin-top:1rem; display:inline-block; vertical-align: middle; position: relative;} .board_list>table .btm+.btm{margin-left:3.1rem;} .board_list>table .btm+.btm:before{content: ""; width: 1px; height: 1.4rem; margin-top:-0.7rem; background-color: #aaa; display: inline-block; position:absolute; left: -1.8rem; top:50%;} .board_list>table .state{margin-top:0.8rem; padding:0;} .board_list>table .state .icon{width:10rem; height:4rem; font-size:2rem;} .board_list>table .file{font-size:2.2rem;} .board_list>table .store_photo{padding:0 0 3rem;} .board_list>table .store_photo img{max-height:40rem;} .board_list>table .store_info{margin-top:1rem; text-align: left; display: flex; justify-content: flex-start; position: relative;} .board_list>table .store_info:before{width:12rem; content: attr(data-title);font-weight: 400; color: #333; white-space: nowrap;} .board_list>table .store_info:after{content:":"; position: absolute; left:9.3rem; top:50%; transform: translateY(-50%);} .board_list>table .store_info+.store_info{margin-top:0.5rem;} .board_list.many{} .board_list.many>table tr{padding-bottom:2rem;} .board_list.many>table td{margin-bottom:1rem; text-align: left; position: relative; display: flex; flex-direction: row; align-items: center; justify-content: flex-start;} .board_list.many>table .bo_tit{justify-content: flex-start;} .board_list.many>table td.td_num2{display:none;} .board_list.many>table td:before{width:12rem; min-width:12rem; content: attr(data-title); padding-right:2rem; font-weight: 500; color: #222; text-align: justify;} .board_list.many>table td:after{content:""; width:1px; height:1.6rem; background-color: #ccc; font-size:0; position: absolute; left:10.5rem; top:50%; transform: translateY(-50%);} .board_list>table .td_chk{} .board_list>table .noPost>td{height:30rem; display: flex; flex-wrap: wrap; flex-direction: row; align-items: center; justify-content: center;} .board_list>table .td_chk:before, .board_list>table .td_chk:after, .board_list>table .noPost>td:before, .board_list>table .noPost>td:after{display:none;} .board_list.line>table{width:100%;} .board_list.line>table th, .board_list.line>table td{border-right:none;} .board_list.line>table .tac .bo_tit, .board_list.line>table .bo_tit.tac{justify-content: flex-start;} /* Board List Style 2 */ .board_area .list{} .board_area .list>li{} .board_area .list>li>*{} .board_area .list>li>a{max-width:100%;} .board_area .list .title{overflow:hidden;} .board_area .list .title>dt{font-size:2.4rem;} .board_area .list .title>dd{margin-left:0rem;} .board_area .list .title>dd>span{padding:0; font-size:2.2rem; line-height:3.2rem; display:block;} .board_area .list .title>dd>span:before{display:none;} .board_area .list .title>dd>div{padding:0; font-size:2.2rem; line-height:3.2rem;} .board_area .list>li>.etc{} .board_area .list>li>.etc>.category>span, .board_area .list>li>.etc>.day{height:auto; display: block;} .board_area .list>li>.etc .category{display:none !important;} .board_area .list>li>.etc .day{margin-left:0; font-size:2rem;} /* Board List Check Style */ .bo_list_wrap .bo_list_top{flex-wrap:nowrap; align-items:stretch;} .bo_list_wrap .bo_list_top .board_search .bo_sch_in input[type=text]{width:100%;} /* Pageing Style */ .paging_all .btns, .paging_all>.num>strong, .paging_all>.num>a{width:5rem; height:5rem;} .paging_all .btns:before, .paging_all .btns:after{width: 1.6rem; height: 1.6rem;} .paging_all .btns.prev:before{margin:-0.8rem 0 0 -0.5rem; transform:rotate(-45deg);} .paging_all .btns.next:before{margin:-0.8rem 0 0 -1.2rem; transform:rotate(135deg);} .paging_all>.num{} .paging_all>.num>strong, .paging_all>.num>a{font-size:2rem;} /* Board View */ .board_view{} .board_view>table{} .board_view>table th, .board_view>table td{padding:3rem 0; font-size:2.2rem;} .board_view>table>thead>tr>th{padding:3rem 0;} .board_view>table .view_cate{padding-bottom:0.8rem; font-size:2.2rem;} .board_view>table .view_title{font-size:2.6rem;} .board_view>table .view_tit{margin-top:0.8rem; font-size:2.6rem;} .board_view>table .view_info{} .board_view>table .view_info>*{} .board_view>table .view_info p.txt{font-size:2.4rem;} .board_view>table .view_info p.txt>strong{} .board_view>table .view_info p.txt+p.txt{} .board_view>table .view_info p.txt+p.txt:before{height:1.4rem; margin-top:-0.8rem;} .board_view>table .state{} .board_view>table .state .icon{width:10rem; height:4rem; font-size:2rem;} .board_view>table .e_icon{padding-left:2rem;} .board_view>table .e_icon>span{width:13rem; height:4rem; font-size:2rem; line-height:3.6rem;} .board_view>table .view_cont{padding:4.5rem 0rem;} .board_view>table #bo_v_img{} .board_view>table #bo_v_img img{} .board_view>table #bo_v_con{} .board_view td.answer>.tit{font-size:2.4rem;} .view_file>a{padding:1.2rem 1.6rem; font-size:2.2rem;} .view_file>a:hover{} /* 매장찾기 */ .customoverlay .coBox, .customoverlay .title{font-size:2rem;} .storePhoto{max-width:calc(100vw - 6rem);} /* 제품 상세 */ .product_view{display: block;} .product_view>*{width:100%; max-width:none;} .product_view .right_box{} .product_view .productText{} .product_view .productText .view-hGroup{padding-bottom:4rem; margin-bottom:4rem;} .product_view .productText .title{font-size:4rem;} .product_view .productText .tit{padding-top:2rem; font-size:2.4rem; line-height:3.6rem;} .product_view .productText .view-scroll{font-size:2.2rem; line-height:1.6;} .product_view .productText .view-scroll ul>li{background-position: left 5px;} /* 시공 상세 */ .portfolio_view{display: block;} .portfolio_view>*{width:100%; max-width:none;} .portfolio_view .right_box{} .portfolio_view .productText{} .portfolio_view .productText .view-hGroup{padding-bottom:4rem; margin-bottom:4rem;} .portfolio_view .productText .title{font-size:4rem;} .portfolio_view .productText .tit{padding-top:2rem; font-size:2.4rem; line-height:3.6rem;} .portfolio_view .productText .view-scroll{font-size:2.2rem; line-height:1.6;} .portfolio_view .productText .view-scroll ul>li{background-position: left 5px;} /* PageNavigation Style */ .pageNavigation{} .pageNavigation>dl{font-size:2.2rem;} .pageNavigation>dl+dl{} .pageNavigation>dl>*{} .pageNavigation>dl>dt{width:10rem; height:7rem;} .pageNavigation>dl>dt:before{width: 1rem; height: 1rem;} .pageNavigation>dl.prev>dt:before{margin:-0.2rem 0 0 0;} .pageNavigation>dl.next>dt:before{margin:-0.7rem 0 0 0;} .pageNavigation>dl>dd{padding:1rem 12.5rem 0.7rem 2.5rem;} .pageNavigation>dl>dd>a{} .pageNavigation>dl>dd>.day{height:7rem; right:2rem; display:none;} /* Comment Style */ .comment_Area{} .comment_Area input[type=text], .comment_Area input[type=password], .comment_Area textarea{width:35%; height:5.5rem; margin-right:1rem; font-size:2.2rem; line-height:5.3rem;} .comment_Area textarea{width:100%; height:20rem; margin-right:0; font-size:2.2rem;} .comment_Area *[type=submit]{width:100%; height:7rem; margin-top:2rem; font-size:2.4rem;} .comment_Area .comment_title{font-size:2.4rem;} .comment_Area .comment_write{padding:3rem 0 4rem;} .comment_Area .comment_write>div{} .comment_Area .comment_write>div.top{} .comment_Area .comment_write>div.top>*{flex:1 1 100%;} .comment_Area .comment_write>div.top>.checkIn{flex-basis:auto;} .comment_Area .comment_write>div.btm{margin-top:2rem; display:block;} .comment_Area .comment_list{} .comment_Area .comment_list>dl{padding:3rem 10rem 3rem 0;} .comment_Area .comment_list>dl>dt{font-size:2.4rem;} .comment_Area .comment_list>dl>dd{} .comment_Area .comment_list>dl>dd p{font-size:2.2rem;} .comment_Area .comment_list>dl>dd p+p{margin-left:2.7rem;} .comment_Area .comment_list>dl>dd p+p:before{height:1.4rem; margin-top:-0.7rem; left: -1.4rem;} .comment_Area .comment_list>dl>dd .comment_option{width:8.6rem; right:0; display:block;} .comment_Area .comment_list>dl>dd .comment_option>a{width:100%; height:4.2rem; padding:0; font-size:2rem; line-height:4rem;display:block;} .comment_Area .comment_list>dl>dd .comment_option>a+a{margin:1rem 0 0 0;} .comment_Area .comment_list>dl.no_comment{} /* Board Write */ .board_write{} .board_write>table{} .board_write>table th, .board_write>table td{height:10rem; padding:1.5rem 0 1.5rem 1.5rem; font-size:2.4rem;} .board_write>table th{width:16rem; padding-left:0;} .board_write input[type=button], .board_write input[type=text], .board_write input[type=password], .board_write input[type=file], .board_write select, .board_write textarea, .board_write .btns{height:7rem; padding:0 1rem; font-size:2.2rem; line-height:6.8rem;} .board_write select{padding-right:5rem; background-position: calc(100% - 1.5rem) center; background-size: 2rem; line-height:7rem;} .board_write textarea{height:30rem; padding:1.5rem;} .board_write .btnBox{} .board_write .btnBox>input, .board_write .btnBox>select{} .board_write .btnBox>input+.btns{} .board_write .minicolors-theme-default .minicolors-swatch{height: 7rem;} .board_write .two{max-width:100%;} .board_write .three{flex-wrap: wrap;} .board_write .three.days{margin:-0.5rem 0;} .board_write .three.days .gap{display:none;} .board_write .three.days input, .board_write .three.days select{flex:1 1 100%; margin:0.5rem 0;} .board_write .three.days .type{display:none;} .board_write .three.phone{max-width:100%; margin:-0.5rem 0;} .board_write .three.phone input, .board_write .three.phone select{flex:1 1 45%; margin:0.5rem 0;} .board_write .three.email{max-width:100%; margin:-0.5rem 0;} .board_write .three.email input{flex:1 1 45%; margin:0.5rem 0;} .board_write .three.email select{flex:1 1 100%; margin:0.5rem 0;} .board_write .three.email input+select{margin-left:0;} .board_write .bo_w_flie>div.script{} .board_write .bo_w_flie>div.script input[type=button]{width:auto; height:5.6rem; padding:0 2rem; line-height:5.4rem;} .board_write .bo_w_flie>div.script>span{line-height:5.4rem;} .board_write .juso{margin-top:0rem; flex-wrap: wrap;} .board_write .juso>input{flex:1 1 100%; width:100%; margin-top:1rem;} .board_write .juso>input+input{width:100%; margin-left:0;} .board_write .checkBox{margin:-1.5rem 0 0 0;} .board_write .checkBox>*{margin-top:1.5rem;} .board_write .checkBox .checkIn label{font-size:2rem;} .board_write .checkBox .checkIn input[type=text]{max-width:calc(100% - 8rem);} .board_write .checkBox .checkIn.lastEtc{width:100%;} .board_write>table .type{font-size:2rem;} /* Board Write 02 */ .board_write.design_02>table, .board_write.design_02>table tbody, .board_write.design_02>table tr, .board_write.design_02>table th, .board_write.design_02>table td{display:block;} .board_write.design_02>table td{padding:1.5rem 0 1.5rem; height:auto; font-size:2.4rem; line-height:1.3; display:block;} .board_write.design_02>table td.half:nth-child(1){padding-right:0;} .board_write.design_02>table td.half:nth-child(2){padding-left:0;} .board_write.design_02 .flex.three{max-width:none;} .board_write.design_02 .captcha_Area{max-width:none;} .board_write.design_02 .captcha_Area input[type="text"]{width:calc(100% - 14rem);} .board_write.design_02 .captComment button{width:4rem;} /* SNS */ .member_connect{} .member_connect .strong{font-size:1.8rem; line-height:4rem;} .member_connect .connect-opener{font-size:2.4rem; line-height:4rem;} #sns-link-pnl .connect-close {width:4rem;height:4rem;font-size:2.6rem} #sns-link-pnl #login_fs label {margin-top:2rem} #sns-link-pnl #login_fs .login_submit {font-size:2.4rem;} #sns-link-pnl .connect-fg .connect-desc{font-size:1.8rem;} .board_write>table .sns-wrap{flex-wrap: wrap;} .board_write>table .sns-wrap .sns-icon{height:4rem;} .board_write>table .sns-wrap .sns-icon .ico{width:4rem; height:4rem;} .board_write>table .sns-wrap .sns-icon .txt{padding-left:1rem; font-size:2rem;} /* Faq List */ .faqArea{} .faqArea>li{} .faqArea>li .checkIn{position: absolute; left:1.5rem; top:1rem;} .faqArea>li .admGos{right:auto; left:5.5rem; top:0.8rem;} .faqArea>li+li{} .faqArea>li .q{font-size:2.2rem; line-height:3.4rem;} .faqArea>li .q:before{height:4rem; font-size:2rem;} .faqArea>li .q:after{font-size:2.5rem; right:3.5rem;} .faqArea>li .q:hover{} .faqArea>li .a{font-size:2.2rem; line-height:3.4rem;} .faqArea>li .a:before{height:4rem; font-size:2rem;} .faqArea>li .a>p{font-size:2.2rem; line-height:3.4rem;} .faqArea>li.noPost{font-size:2.2rem;} .faqArea>li.ad{padding-top:3rem;} /* Photo List */ .photo_list ul.list{gap:2rem;} .photo_list ul.list li{width:calc((100% - 2rem) / 2);} .photo_list ul.list li .gall_cont p.over>span{font-size:2rem;} .photo_list ul.list li .gall_cont .area{min-height:14.1rem; padding:2rem 0 5.6rem;} .photo_list ul.list li .gall_cont .area .tt{font-size:2.4rem; line-height:3rem;} .photo_list ul.list li .gall_cont .area .title{font-size:2.6rem;} .photo_list ul.list li .gall_cont .area .title .icon{} .photo_list ul.list li .gall_cont .area .title .icon:before{min-width:2.4rem; min-height:2.4rem; font-size:1.4rem; line-height:2.4rem;} .photo_list ul.list li .gall_cont .area .cate, .photo_list ul.list li .gall_cont .area .day{font-size:2rem;} .photo_list ul.list li .gall_cont .area .btns{margin-top:2.5rem; display: flex; justify-content: center;} .photo_list ul.list li .gall_cont .area .btns>*{height:4.6rem; padding:0 2.2rem; font-size:1.8rem;} .photo_list ul.list li .gall_cont .area .btns.down img{width:1.7rem;} .photo_list ul.list li .gall_cont .area .e_icon{} .photo_list ul.list li .gall_cont .area .e_icon>span{width:100%; height:4rem; line-height:3.5rem; border-radius:4px;} .photo_list ul.list li .gall_cont .area .two{max-height:6rem;} .photo_list ul.list li .gall_cont .area .three{max-height:9rem;} .photo_list button.more{width:28rem; height:7rem; font-size:2.2rem;} .photo_list button.more:after{font-size:2rem;} .photo_list ul.list li.noPost{font-size:2.2rem;} /* newsletter */ .photo_list.newsletter{} .photo_list.newsletter ul.list{gap:2rem;} .photo_list.newsletter ul.list li{width:calc((100% - 2rem) / 2);} /* cooking */ .photo_list.cooking ul.list{gap:2rem;} .photo_list.cooking ul.list li{width:calc((100% - 2rem) / 2);} /* store */ .photo_list.store ul.list{gap:2rem;} .photo_list.store ul.list li{width:calc((100% - 2rem) / 2);} /* 인증서 */ .photo_list.certified{} .photo_list.certified ul.list{gap:2rem;} .photo_list.certified ul.list li{width:calc((100% - 2rem) / 2);} /* 동영상 */ .photo_list.movie{} .photo_list.movie ul.list{gap:2rem;} .photo_list.movie ul.list li{width:calc((100% - 2rem) / 2);} /* 제조설비 */ .photo_list.Facilities{} .photo_list.Facilities ul.list{gap:2rem;} .photo_list.Facilities ul.list li{width:calc((100% - 2rem) / 2);} .photo_list ul.list li.noPost{width:100% !important; font-size:2.2rem;} /* Store2 */ .storeMapType2{} .storeMapType2 .storeMap_list{} .storeMapType2 .storeMap_list>li{} .storeMapType2 .storeMap_list>li .checkIn.noTxt{} .storeMapType2 .storeMap_list>li .admGos{} .storeMapType2 .storeMap_list>li+li{} .storeMapType2 .storeMap_list>li.noPost{font-size: 2rem;} .storeMapType2 .storeMap_list .link{} .storeMapType2 .storeMap_list .link .title{padding-right:3.2rem; background-size: 2.2rem; font-size:2.4rem;} .storeMapType2 .storeMap_list .link .text{font-size:2rem;} .storeMapType2 .storeMap_list .link .btns{} .storeMapType2 .storeMap_list .link .btns>span{height:6rem; font-size:2rem; line-height:5.8rem;} .storeMapType2 .storeMap_list .link:hover{} .storeMapType2 #storeMap{height:40rem;} .storeFancyLay{padding:2rem !important; font-size:2rem;} .storeFancyLay .store_view .left_box{margin-top:3rem;} .storeFancyLay .store_info th, .storeFancyLay .store_info td{padding:0.8rem 0 0.8rem 2rem; font-size:2rem;} } @media only screen and (max-width : 640px){ /* 주요거래처 */ .photo_list.client ul.list li{width:calc((100% - 2rem) / 2);} /* 제품소개 */ .photo_list.product ul.list li{width:100%;} /* 시공사례 */ .bo_list_wrap .bo_list_cont{width:100%;} .photo_list.portfolio ul.list li{width:100%;} } /* transition: all .5s linear; transition: all .5s ease-out; transform:rotate(180deg); -webkit-transition-timing-function:ease-in linear; transition-timing-function:ease-in linear; -webkit-transition-delay: .8s; transition-delay: .8s; :before{content: ""; width: 24px; height: 24px; background-color: #fff; border:1px solid #666; display: inline-block; position:absolute; left: 0; top:0px;} display: flex; justify-content: space-between; // 양쪽 끝 정렬 display: flex; justify-content: space-around; // 센터 정렬 display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; //한줄 감추기 display: block; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; //두줄 감추기 active :first-child text-indent:-99999px; !important display:table; table-layout:fixed; display:table-row; display:table-cell; box-sizing:border-box; word-break:keep-all; word-wrap:break-word; border-radius:2px; */