@charset "utf-8";

/* 내용관리 */
/*.footer { margin-top: 0 !important; }*/
.container { width:100% !important; max-width:1600px; }

img { display:inline-block; max-width:100%; height:auto; }

.ctt_security {  }
.ctt_security * { text-transform: capitalize; }
.sub_tit { text-align: center; box-sizing:border-box; }
.sub_tit .tit { font-size:36px; color:#3a3a3a; font-weight: 800; margin-bottom: 22px; }
.sub_tit .tit .inner { display:inline-block; position:relative; }
.sub_tit .tit .inner:before { content:""; display:inline-block; width:10px; height:9px; background:url(../../../img/dia.png) center center no-repeat; position:absolute; left:1px; top:-12px; }
.sub_tit .txt { font-size:18px; color:#000; line-height: 36px; }

.bgFa { background:#fafafa !important; }
.bgFf { background:#fff !important; }

/* 기본 컬러 및 폰트 세팅 */
:root {
    --main-color: #fdb811;
    --font-base: #393739;
    --font-dark: #3a3a3a;
    --white: #ffffff;
}

.newCtt .m-br { display: none; }

/* 히어로 섹션 */
.newCtt .hero-intro-section { padding: 10rem 0; text-align: center; }
.newCtt .brand-label { font-size: 1.8rem; font-weight: 700; color: var(--main-color); margin-bottom: 1.5rem; }
.newCtt .hero-main-title { font-size: 4rem; color: var(--font-dark); font-weight: 800; line-height: 1.3; }
.newCtt .hero-desc { font-size: 2rem; color: #666; margin-top: 1.5rem; }

/* 서비스 소개 영역 */
.newCtt .service-detail-section { padding: 8rem 0; background: #fafafa; }
.newCtt .q-title { font-size: 2.4rem; color: var(--font-dark); font-weight: 600; text-align: center; margin-bottom: 2rem; }
.newCtt .base-desc { font-size: 1.8rem; text-align: center; margin-bottom: 1rem; }
.newCtt .highlight-point { font-size: 1.8rem; text-align: center; font-weight: 600; color: #555; }

.newCtt .key-point-box { background: var(--white); border: 3px solid var(--main-color); border-radius: 2rem; padding: 5rem; margin-top: 6rem; }
.newCtt .box-title { font-size: 2.4rem; color: var(--font-dark); margin-bottom: 2.5rem; font-weight: 800; }
.newCtt .importance-list li { font-size: 2rem; font-weight: 700; margin-bottom: 1rem; color: var(--font-dark); }
.newCtt .point-summary { font-size: 1.8rem; font-weight: 600; margin-top: 2rem; }
.newCtt .tag-group { display: flex; flex-wrap: wrap; gap: 1.5rem; margin-top: 2.5rem; padding-top: 2rem; border-top: 1px solid #eee; color: #888; font-size: 1.6rem; }

/* info-grid-section (이미지 좌우 배치) */
.newCtt .info-grid-section { padding: 10rem 0; }
.newCtt .grid-flex-wrap { display: flex; gap: 5rem; }
.newCtt .grid-item { flex: 1; display: flex; flex-direction: column; }
.newCtt .item-img-box { width: 100%; height: 28rem; border-radius: 1.5rem; overflow: hidden; margin-bottom: 2.5rem; background: #eee; }
.newCtt .item-img-box img { width: 100%; height: 100%; object-fit: cover; }

.newCtt .item-title { font-size: 2.4rem; color: var(--font-dark); margin-bottom: 2rem; font-weight: 800; }
.newCtt .check-dot-list li { font-size: 1.8rem; margin-bottom: 1rem; }
.newCtt .slogan-bold { font-size: 2rem; font-weight: 800; color: var(--main-color); margin-top: 2rem; }

.newCtt .grid-item.border-left { border-left: 1px solid #ddd; padding-left: 5rem; }

/* 프로세스 영역 */
.newCtt .process-section { padding: 10rem 0; text-align: center; background: #fafafa; }
.newCtt .process-main-title { font-size: 3.2rem; color: var(--font-dark); margin-bottom: 5rem; font-weight: 800; }
.newCtt .process-flex-container { display: flex; gap: 1rem; }
.newCtt .process-card { flex: 1; background: var(--white); padding: 3rem 2rem; border-top: 4px solid var(--main-color); text-align: left; border-radius: 0 0 1.5rem 1.5rem; }
.newCtt .process-card i { margin: 2rem 0 2rem; display:block; }
.newCtt .step-no { font-size: 1.6rem; font-weight: 800; color: var(--main-color); display: block; margin-bottom: 1rem; }
.newCtt .step-tit { font-size: 2rem; font-weight: 700; color: var(--font-dark); margin-bottom: 1rem; }
.newCtt .step-txt { font-size: 1.6rem; color: #777; }

/* 하단 가이드 */
.bottom-guide-section { color: var(--font-dark); text-align: center; padding: 8rem 0; }
.guide-title { font-size: 2.8rem; font-weight: 800; margin-bottom: 1.5rem; }
.guide-desc { font-size: 2rem; font-weight: 400; margin-bottom: 5rem; }

/* 반응형 */
@media (max-width: 1024px) {
    .newCtt .grid-flex-wrap { flex-direction: column; gap: 6rem; }
    .newCtt .grid-item.border-left { border-left: none; padding-left: 0; border-top: 1px solid #ddd; padding-top: 6rem; }
    .newCtt .process-flex-container { flex-wrap: wrap; }
    .newCtt .process-card { flex: 0 0 calc(50% - 1rem); margin-bottom: 1rem; }
}

@media (max-width: 768px) {
    .newCtt .m-br { display: block; }
    .newCtt .hero-main-title { font-size: 2.8rem; }
    .newCtt .process-card { flex: 0 0 100%; }
}

/* ==================================================
   웹호스팅 서브 페이지 전용 추가 스타일
================================================== */

/* 웹호스팅 정의 텍스트 */
.newCtt .hosting-def-txt { font-size: 1.8rem; font-weight: 500; line-height: 1.6; margin-bottom: 1.5rem; }
.newCtt .hosting-def-txt:last-child { margin-bottom: 0; }

/* 우측 차별화 스펙 리스트 */
.newCtt .differ-spec-list .spec-item { margin-bottom: 2rem; }.newCtt .differ-spec-list .spec-item:last-child { margin-bottom: 0; }
.newCtt .spec-tit { display: block; color: var(--main-color); font-size: 2rem; font-weight: 800; margin-bottom: 0.5rem; }
.newCtt .spec-desc { display: block; font-size: 1.6rem; color: #666; line-height: 1.5; word-break: keep-all; }

/* ==================================================
   유지보수 서브 페이지 전용 추가 스타일
================================================== */

/* 중앙 정렬형 체크리스트 (문제 제기 영역) */
.newCtt .center-check-list { text-align: center; margin-bottom: 4rem; }.newCtt .center-check-list li { font-size: 1.8rem; font-weight: 700; color: #555; margin-bottom: 1.2rem; }
.newCtt .center-check-list li:last-child { margin-bottom: 0; }

/* 중요 포인트 박스 내부 설명 텍스트 */
.newCtt .box-desc-txt { font-size: 1.8rem; font-weight: 500; line-height: 1.6; margin-bottom: 1.5rem; color: var(--font-dark);}
.newCtt .box-desc-txt:last-child { margin-bottom: 0; }

/* 모바일 대응 (가독성 보완) */
@media (max-width: 768px) {
    .newCtt .center-check-list li { font-size: 1.6rem; }
}

/* ==================================================
   SSL 보안서버 서브 페이지 전용 추가 스타일
================================================== */

/* 하단 인증서 종류 안내 섹션 */
.newCtt .ssl-cert-section { padding: 6rem 0 10rem; text-align: center; }
.newCtt .cert-title { font-size: 2.8rem; color: var(--font-dark); font-weight: 800; margin-bottom: 4rem; }
.newCtt .cert-list-wrap { display: inline-block; background: #fafafa; border: 1px solid #eee; border-radius: 1.5rem; padding: 4rem 6rem;     text-align: left; margin-bottom: 3rem; }
.newCtt .cert-list li { font-size: 1.8rem; color: var(--font-base); margin-bottom: 1.5rem; }
.newCtt .cert-list li:last-child { margin-bottom: 0; }
.newCtt .cert-label { color: var(--main-color); font-weight: 800; margin-right: 0.5rem; }
.newCtt .cert-slogan { font-size: 2rem; font-weight: 700; color: var(--font-dark); }

/* 모바일 대응 */
@media (max-width: 768px) {
    .newCtt .cert-title { font-size: 2.4rem; }
    .newCtt .cert-list-wrap { padding: 3rem; display: block; }
    .newCtt .cert-list li { font-size: 1.6rem; }
    .newCtt .cert-slogan { font-size: 1.8rem; }
}



.ctt_security .sub_tit { padding: 112px 0 0;  }
.ctt_security .section01 { padding: 44px 0 110px; box-sizing:border-box; }
.ctt_security .section01 .img_box { display:flex; align-items:start; padding-bottom: 20px; box-sizing:border-box; }
.ctt_security .section01 .img_box dt,
.ctt_security .section01 .img_box dd { box-sizing:border-box; }
.ctt_security .section01 .img_box dt { position:relative; width:730px; flex-shrink:0; }
.ctt_security .section01 .img_box .tit_box { background:url(../../../img/tit_bg.png) left bottom no-repeat; width:100%; max-width:320px; height:184px; position:absolute; right:0 ;top:0; display:flex; font-size:26px; color:#fff; line-height: 34px; font-weight: 600; align-items:center; justify-content:center; text-align: center; }
.ctt_security .section01 .img_box dd { padding-left: 70px; padding-top: 68px; }
.ctt_security .section01 .img_box .txt { font-size:18px; color:#666; line-height: 36px; }
.ctt_security .section01 .info_box { display:flex; margin-bottom: 0; margin-top: 50px; }
.ctt_security .section01 .info_box dt,
.ctt_security .section01 .info_box dd { box-sizing:border-box; }
.ctt_security .section01 .info_box dt { width:730px; flex-shrink:0; font-size:28px; color:#000; line-height: 36px; text-align: right; font-weight: 400; padding-right: 73px; border-right: 2px solid #dadada; }
.ctt_security .section01 .info_box dd { width:calc(100% - 730px); font-size:18px; color:#666; line-height: 36px; font-weight: 400; padding-left: 70px; }
.ctt_security .section01 .info_box dd strong { font-weight: 600; color:#000; }



.ctt_security .section02 { background:#f7f7f7; padding: 110px 0 130px; box-sizing:border-box; }
.section_tit { font-size:36px; color:#3a3a3a; font-weight: 700; text-align: center; margin-bottom: 60px; }
.ctt_security .list_box { display:flex; justify-content:center; }
.ctt_security .list_box .box { padding: 0 15px; box-sizing:border-box; }
.ctt_security .list_box .box .inner {width:320px; background:#fff; text-align: center; height:100%; padding: 46px 30px 46px; box-sizing:border-box; }
.ctt_security .list_box .box .tit { font-size:36px; color:#000; font-weight: 600; }
.ctt_security .list_box .box .tit span { font-size:2.4rem; color:#999; font-weight: 600; display:block; margin-bottom: 6px; }
.ctt_security .list_box .box .progress_bar { text-align:left; display:flex; flex-direction:column; align-items:center; margin: 34px 0 34px; }
.ctt_security .list_box .box .progress_bar li { display:flex; align-items:center; width:100%; max-width:244px; margin-top: 6px; }
.ctt_security .list_box .box .progress_bar li:first-child { margin-top: 0; }
.ctt_security .list_box .box .progress_bar li span { font-size:15px; color:#3a3a3a; display:inline-block; width:95px; flex-shrink:0; }
.ctt_security .list_box .box .progress_bar li .bar { display:flex; width:calc(100% - 95px); }
.ctt_security .list_box .box .progress_bar li .bar i { display:inline-block; width:calc(100% / 6); height:7px; margin-left: 1px; box-sizing:border-box; }
.ctt_security .list_box .box .progress_bar li:nth-child(1) .bar i { background:#78d1b6; border: 1px solid #4ea188; }
.ctt_security .list_box .box .progress_bar li:nth-child(2) .bar i { background:#f9c4cc; border: 1px solid #e0909b; }
.ctt_security .list_box .box .progress_bar li:nth-child(3) .bar i { background:#bfc9eb; border: 1px solid #7e91d4; }

.ctt_security .list_box .box .progress_bar li .zero i:nth-child(n + 0) { background:#fff; border: 1px solid #bebebe; }
.ctt_security .list_box .box .progress_bar li .one i:nth-child(n + 2) { background:#fff; border: 1px solid #bebebe; }
.ctt_security .list_box .box .progress_bar li .two i:nth-child(n + 3) { background:#fff; border: 1px solid #bebebe; }
.ctt_security .list_box .box .progress_bar li .three i:nth-child(n + 4) { background:#fff; border: 1px solid #bebebe; }
.ctt_security .list_box .box .progress_bar li .four i:nth-child(n + 5) { background:#fff; border: 1px solid #bebebe; }
.ctt_security .list_box .box .progress_bar li .five i:nth-child(n + 6) { background:#fff; border: 1px solid #bebebe; }
.ctt_security .list_box .box .progress_bar li .six i:nth-child(n + 7) { background:#fff; border: 1px solid #bebebe; }

.ctt_security .list_box .box .txt { font-size:18px; color:#666; line-height: 32px; letter-spacing: -0.0525em; margin-bottom: 0; }



.ctt_security .section03 { padding: 110px 0 130px; box-sizing:border-box; }
/*
.flex_table { display:flex; flex-direction:column; width:100%; max-width:1312px; margin: 0 auto; }
.flex_table .fhead,
.flex_table .fbody { display:flex; flex-direction:column; }
.flex_table .fhead {  }
.flex_table .tr { display:flex; }
.flex_table .fhead .tr { align-items:end;  }
.flex_table .tr .th,
.flex_table .tr .td { width:20%; max-width:270px; margin: 5px; font-size:20px; }
.flex_table .tr .th:first-child,
.flex_table .tr .td:first-child { max-width:180px; }
.flex_table .tr .th .inner,
.flex_table .tr .td .inner { height:100%; width:100%; display:flex; align-items:center; justify-content:center; text-align: center; flex-direction:column; padding: 20px 10px; box-sizing:border-box; }
.flex_table .fhead .tr .th {  }
.flex_table .fhead .tr .th .inner { border-radius:8px 8px 0 0; font-weight: 600; height:70px; }
.flex_table .fhead .tr .th:first-child .inner { height:50px; }
.flex_table .fhead .tr .th:nth-child(n + 2) .inner { color:#fff; }
.flex_table .fbody {  }
.flex_table .fbody .tr {  }
.flex_table .fbody .tr .td {  }
.flex_table .fbody .tr .td:first-child {  }
.flex_table .fbody .tr .td .inner { font-weight: 500; }
.flex_table .fbody .tr .td:first-child .inner {  }
.flex_table .fbody .tr .td .inner small { display:block; font-size:18px; font-weight: 400; }
.flex_table .fbody .tr .td:first-child .inner small { font-size:16px; }

.flex_table .tr .th:first-child .inner,
.flex_table .tr .td:first-child .inner { background:#eee; font-size:18px; }
.flex_table .tr .th:nth-child(2) .inner { background:#4ea188; }
.flex_table .tr .td:nth-child(2) .inner { background:#f8fafc; color:#4ea188; }
.flex_table .tr .th:nth-child(3) .inner { background:#7e91d4; }
.flex_table .tr .td:nth-child(3) .inner { background:#faf9fe; color:#7e91d4; }
.flex_table .tr .th:nth-child(4) .inner { background:#e0909b; }
.flex_table .tr .td:nth-child(4) .inner { background:#faf5f5; color:#e0909b; }
.flex_table .tr .th:nth-child(5) .inner { background:#8d689e; }
.flex_table .tr .td:nth-child(5) .inner { background:#f8f3f9; color:#8d689e; }
.flex_table .tr .th:nth-child(6) .inner { background:#9694d0; }
.flex_table .tr .td:nth-child(6) .inner { background:#f2f2fc; color:#9694d0; }
*/
/* ==================================================
   비교표 (Flex Table) 공통 스타일
================================================== */
.flex_table { display: table; width: 100%; max-width: 1300px; margin: 0 auto; border-top: 4px solid var(--main-color); border-bottom: 2px solid var(--font-dark); table-layout:fixed; }
.flex_table .tr { display: table-row; }
.flex_table .tr .th,
.flex_table .tr .td { display: table-cell; font-size: 1.8rem; padding: 2rem 1.5rem; box-sizing: border-box;     vertical-align: middle; text-align: center; border-bottom: 1px solid #eeeeee; color: var(--font-base); word-break: keep-all;    line-height: 1.5;}

.flex_table small { font-size: 1.4rem; color: #888; }
.flex_table .fhead { display: table-header-group; background: #fafafa; }
.flex_table .fhead .tr .th { font-weight: 800; color: var(--font-dark); border-bottom: 1px solid #dddddd; font-size: 2rem;}
.flex_table .fbody { display:table-row-group; }
.flex_table .fbody .tr .td:first-child { font-weight: 700; color: var(--font-dark); background: #fdfdfd; border-right: 1px solid #f4f4f4;}
.flex_table .fbody .tr .td { }
.flex_table .fbody .tr .td small { display:block; font-weight: 700; }
.flex_table .fbody .tr:hover .td { background-color: #fafafa; }

/* ==================================================
   모바일 반응형 (768px 이하) - 카드형 변환
================================================== */
@media (max-width: 768px) {
    .flex_table { display: block; border: none; }
    .flex_table .fhead { display: none; }
    .flex_table .fbody { display: block; }
    
    .flex_table .tr { display: block; border: 2px solid var(--main-color); background: #fff; margin-bottom: 3rem; border-radius: 1rem; overflow: hidden; box-shadow: 0 5px 15px rgba(0,0,0,0.05); }
	.flex_table .tr .td { display: flex; justify-content: space-between; align-items: center; text-align: right; padding: 1.5rem 2rem; font-size: 1.6rem; }
	.flex_table .fbody .tr .td:first-child { display: block; text-align: center; background: var(--main-color); color: var(--font-dark);        font-size: 2rem; font-weight: 800; border-bottom: none; padding: 1.5rem; }
    .flex_table .tr .td:not(:first-child) { border-bottom: 1px solid #f1f1f1; }   
	.flex_table .tr .td:last-child { border-bottom: none; }
    
    .flex_table .tr .td:not(:first-child)::before { content: attr(data-label); font-weight: 700; color: var(--font-dark); text-align: left;        margin-right: 2rem; min-width: 70px; }
}


.important { font-size:16px; color:#666; display:flex; width:100%; max-width:1302px; margin: 25px auto 0; }
.important i { flex-shrink:0; font-size:20px; color:#de3d4c; margin-right: 10px; margin-top: 5px; }



.filter_tab { display:flex; align-items:center; justify-content:center; }
.filter_tab li { margin: 0 2px; }
.filter_tab li a { display:flex; align-items:center; height:35px; border: 1px solid #bbb; box-sizing:border-box; border-radius:5px; transition:all 0.3s; padding: 0 20px; position:relative; text-align: center; justify-content:center; }
.filter_tab li.on a { background: #fdb811; color:#000; font-weight: 600; }
.filter_tab li a:hover {  }
.filter_tab li a .tooltips { display:inline-flex; justify-content:center; align-items:center; text-align: center; position:absolute; top:-30px; font-weight: 600; border-radius:5px; height:30px; box-sizing:border-box; padding: 0 10px; color:#fff; background:#222; opacity:0; transition:all 0.3s; }
.filter_tab li a:hover .tooltips { top:-50px; opacity:1; }
.filter_tab li a .tooltips:after { content:"\f0d7"; color:#222; position:absolute; bottom:-12px; font-family: "Font Awesome 5 Free"; }

.work { padding: 12rem 0 15rem; box-sizing:border-box; }
.work .containers { max-width:100%; }
.work .tit_box { width:100%; max-width:1600px; margin-left: auto; margin-right: auto; }
.work .filter_wrap { display:flex; flex-wrap:wrap; margin-top: -1rem; }
.work .filter_wrap article { width:25%; margin-top: 9rem; position:static ; }
.work .filter_wrap article a {  }
.work .filter_wrap article a .img {  }
.work .filter_wrap article a .txt_box { padding: 2.6rem 2rem 0; box-sizing:border-box; }
.work .filter_wrap article a .txt_box .value { font-size:1.6rem; color:#aaa; }
.work .filter_wrap article a .txt_box .name { font-size:2rem; color:#000; font-weight: 600; margin-top: 4px; }
.work .btn_box { text-align: center; margin-top: 15.5rem; }
.work .btn_box a { font-size:2rem; color:#000; font-weight: 600; display:inline-flex; align-items:center; }
.work .btn_box a i { display:inline-block; width:36px; height:36px; background:url(../img/more_arrow.png) center center no-repeat; border-radius:50%; margin-left: 2rem; }



.ctt_contact .tit_box { margin-bottom: 6rem; box-sizing:border-box; }
.ctt_intro_180601 .tit_box .tit,
.ctt_contact .tit_box .tit,
.ctt_estimate .tit_box .tit,
.ctt_maintance_request .tit_box .tit { font-size:6rem; color:#222; font-weight: 700; display:flex; align-items:baseline; margin-bottom: 0; }
.ctt_intro_180601 .tit_box .tit:after,
.ctt_contact .tit_box .tit:after,
.ctt_estimate .tit_box .tit:after,
.ctt_maintance_request .tit_box .tit:after { content: ""; display: inline-block; width: 10px; height: 9px; background: url(../../../img/dia.png) center center no-repeat; margin-left: 2rem; }
.ctt_contact .tit_box .stit { font-size:2.2rem; color:#3a3a3a; font-weight: 600; margin-bottom: 3rem; }
.ctt_contact .tit_box .txt { font-size:1.8rem; color:#3a3a3a; font-weight: 400; line-height: 28px; margin-bottom: 6rem; }
.ctt_contact .tit_box .txt strong { color:#000; font-weight: 600; }

.ctt_contact { padding: 10rem 0 15rem; box-sizing:border-box; }
.ctt_contact .section01 {  }
.ctt_contact .section01 .tit_box {  }
.ctt_contact .section01 .tit_box:after { content:""; display:block; width:80%; height:1px; background:#eaeaea; }

.ctt_contact .section01 .info_box {  }
.ctt_contact .section01 .info_box .tit { font-size:2.4rem; color:#000; font-weight: 600; }
.ctt_contact .section01 .info_box .info { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; padding-right: 10rem; margin-top: 2rem; }
.ctt_contact .section01 .info_box .info li {  }
.ctt_contact .section01 .info_box .info li,
.ctt_contact .section01 .info_box .info li a { font-size:1.8rem; color:#000; }
.ctt_contact .section01 .info_box .info li strong {  }
.ctt_contact .section01 .info_box .info li a {  }

.ctt_contact .section02 { padding: 10rem 0; box-sizing:border-box; }

.ctt_contact .section03 .btn_box {  }
.ctt_contact .section03 .btn_box a { display:flex; align-items:center; justify-content:center; text-align: center; font-size:1.8rem; color:#fff; font-weight: 700; border: 1px solid transparent; box-sizing:border-box; width:220px; height:60px; background:#121212; }
.ctt_contact .section03 .btn_box a img { margin-right: 8px; }


.progress { height:30px !important; overflow:visible !important; box-shadow: 0 0 0 0 !important; }
.progress .progress-bar { border-radius:10px !important; background:#fdb811 !important; box-shadow: 0 0 0 0 !important; }
.progress .progress-icon { top:50% !important; margin-top: -15px; border-color:#fdb811 !important; color:#fdb811 !important; }
.progress-value { top:-25px !important; color:#000 !important; font-weight: 600; }



.ctt_estimate { padding: 10rem 0 15rem; box-sizing:border-box; }
.ctt_estimate .tit_box {  }
.ctt_estimate .tit_box .tit { margin-bottom: 6rem; }

.ctt_estimate .sticky_wrap { display:flex; }
.ctt_estimate .stit_box { width:500px; }
.ctt_estimate form { padding-left: 5rem; box-sizing:border-box; width:calc(100% - 500px); } 

.ctt_estimate .stit_box .bot_box { display:flex; align-items:start; justify-content:start; flex-direction:column; position:sticky; top:80px; padding-top: 0; }
.ctt_estimate .stit_box .bot_box .left,
.ctt_estimate .stit_box .bot_box .right {  }
.ctt_estimate .stit_box .bot_box .left {  }
.ctt_estimate .stit_box .bot_box .left .stit { font-size:4rem; color:#3a3a3a; font-weight: 300; line-height: 1.2em; margin-bottom: 24px; }
.ctt_estimate .stit_box .bot_box .left .txt { font-size:14px; color:#222; line-height: 3rem; }
.ctt_estimate .stit_box .bot_box .left dl { display:flex; align-items:center; margin-bottom: 0; }
.ctt_estimate .stit_box .bot_box .left dl dt,
.ctt_estimate .stit_box .bot_box .left dl dd { font-size:14px; color:#222; }
.ctt_estimate .stit_box .bot_box .left dl dt {  }
.ctt_estimate .stit_box .bot_box .left dl dd { margin-left: 5px; }
.ctt_estimate .stit_box .bot_box .left dl dd a { border-bottom: 1px solid var(--main_c1); color:#222; display:inline-block; }
.ctt_estimate .stit_box .bot_box .right { display:flex; justify-content:start; margin-top: 5rem; padding-left: 0; width:100%; }
.ctt_estimate .stit_box .bot_box .right li { width:100%; max-width:130px; margin-right: 1rem; }
.ctt_estimate .stit_box .bot_box .right li a { width:100%; height:160px; display:flex; flex-direction:column; align-items:start; justify-content:space-between; box-sizing:border-box; padding: 27px 20px 20px; border-radius:5px; border: 2px solid transparent; transition:all 0.3s; }
.ctt_estimate .stit_box .bot_box .right li a .atit { font-size:14px; font-weight: 500; transition:all 0.3s; }
.ctt_estimate .stit_box .bot_box .right li a .btn { padding: 0; font-size:12px; font-weight: 500; transition:all 0.3s; }
.ctt_estimate .stit_box .bot_box .right li a .btn i { font-size:16px; margin-right: 5px; transition:all 0.3s; }

.ctt_estimate .stit_box .bot_box .right li.point {  }
.ctt_estimate .stit_box .bot_box .right li.point a { background:var(--main_c1); }
.ctt_estimate .stit_box .bot_box .right li.point a .atit { color:#222; }
.ctt_estimate .stit_box .bot_box .right li.point a .btn { color:#222; }

.ctt_estimate .stit_box .bot_box .right li.namecard {  }
.ctt_estimate .stit_box .bot_box .right li.namecard a { background:#000; }
.ctt_estimate .stit_box .bot_box .right li.namecard a .atit { color:#fff; }
.ctt_estimate .stit_box .bot_box .right li.namecard a .btn { color:#fff; }

.ctt_estimate .stit_box .bot_box .right li.point a:hover { border-color:var(--main_c1); background:#fff; }
.ctt_estimate .stit_box .bot_box .right li.namecard a:hover { border-color:#000 !important; background:#fff; }
.ctt_estimate .stit_box .bot_box .right li.point a:hover * { color:var(--main_c1); }
.ctt_estimate .stit_box .bot_box .right li.namecard a:hover * { color:#000; }


.ctt_estimate form .inner { border: solid #222; box-sizing:border-box; border-width:4px 0; margin-top: 5rem; }
.ctt_estimate .itit { font-size:2rem; color:#222; font-weight: 600; margin-top: 0; }
.ctt_estimate .itit small { display:block; color:#de3d4c; font-size:14px; font-weight: 600; margin-top: 1rem; }
.ctt_estimate .top_box,
.ctt_estimate .bot_box { padding: 3.5rem 0 3.5rem; box-sizing:border-box; }

.ctt_estimate .top_box { border-bottom: 1px solid #dadada; }
.ctt_estimate .top_box .input_box { display:flex; flex-wrap:wrap;  }
.ctt_estimate .top_box .itit { margin-bottom: 2rem; }
.ctt_estimate .top_box .input_box input { position:absolute; opacity:0; left:0; top:0; }
.ctt_estimate .top_box .input_box > div { width:33.33%; margin: 13px 0; position:relative; }
.ctt_estimate .top_box .input_box label { display:inline-flex; }
.ctt_estimate .top_box .input_box label i { margin-right: 7px; display:inline-flex; width:20px; height:20px; border: 2px solid #ccc; box-sizing:border-box; align-items:center; justify-content:center; text-align: center; font-style:normal; border-radius:5px; transition:all 0.2s; }
.ctt_estimate .top_box .input_box label i:before { content:"\f00c"; font-family: "Font Awesome 5 Free"; font-size:12px; color:#222; transition:all 0.2s; opacity:0; }

.ctt_estimate .top_box .input_box input:checked + label > i { background:var(--main_c1); border-color:transparent; }
.ctt_estimate .top_box .input_box input:checked + label > i:before { opacity:1; }


.ctt_estimate form .bot_box { display:flex; align-items:start; padding-bottom: 6rem; }
.ctt_estimate form .bot_box .left,
.ctt_estimate form .bot_box .right { flex:1; box-sizing:border-box; }
.ctt_estimate form .bot_box .left { padding-right: 3.5rem; }
.ctt_estimate form .bot_box .right { padding-left: 3.5rem; }

.ctt_estimate .inner .bot_box .form-group { margin-bottom: 0; margin-top: 4rem; }
.ctt_estimate .inner .bot_box .form-group .label_t { font-size:14px; color:#666; font-weight: 600; margin-bottom: 10px; }
.ctt_estimate .inner .bot_box .form-group .label_t small { color:#de3d4c; }
.ctt_estimate .inner .bot_box .form-group .input_box {  }
.ctt_estimate .inner .bot_box .form-group .input_box input[type="text"],
.ctt_estimate .inner .bot_box .form-group .input_box select,
.ctt_estimate .inner .bot_box .form-group .input_box textarea,
.ctt_estimate .inner .bot_box .form-group .input_box .file_box .uname { font-size:16px; color:#3a3a3a; border: 0 !important; box-shadow:0 0 0 0 !important; border: 2px solid #dadada !important; box-sizing:border-box; border-radius:0 !important; font-weight: 500; width:100%; }
.ctt_estimate .inner .bot_box .form-group .input_box input[type="text"],
.ctt_estimate .inner .bot_box .form-group .input_box select,
.ctt_estimate .inner .bot_box .form-group .input_box .file_box .uname { height:55px; padding: 0; padding-left: 10px; }
.ctt_estimate .inner .bot_box .form-group .input_box select { -o-appearance: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; }

.ctt_estimate .inner .bot_box .form-group .input_box input[type="text"]:focus,
.ctt_estimate .inner .bot_box .form-group .input_box select:focus { border: 2px solid #222 !important; }

.ctt_estimate .inner .bot_box .form-group .sel_type { position:relative; }
.ctt_estimate .inner .bot_box .form-group .sel_type select { position:relative; z-index:0; background:#fff; }
.ctt_estimate .inner .bot_box .form-group .sel_type:before { content:"\f107"; font-family: "Font Awesome 5 Free"; font-weight: 600; position:absolute; right:20px; bottom:0; height:55px; display:flex; align-items:center; color:#666; z-index:1; }

.ctt_estimate .inner .bot_box .form-group .input_box.mail_type { display:flex; align-items:end; }
.ctt_estimate .inner .bot_box .form-group .input_box.mail_type > .imt { display:inline-block; width:calc(100% - 150px); padding-right: 10px; box-sizing:border-box; }
.ctt_estimate .inner .bot_box .form-group .input_box.mail_type .help-block { width:150px; display:inline-flex; height:55px; text-align: center; justify-content:center; align-items:center; position:relative; margin: 0; }
.ctt_estimate .inner .bot_box .form-group .input_box.mail_type .help-block input { position:absolute; left:0; top:0; opacity:0; }
.ctt_estimate .inner .bot_box .form-group .input_box.mail_type .help-block label { argin-left: 0; padding-left: 0; transition:all 0.5s;  border: 1px solid #dadada; box-sizing:border-box; display:flex; width:100%; height:100%; text-align: center; justify-content:center; align-items:center; }
.ctt_estimate .inner .bot_box .form-group .input_box.mail_type .help-block label i { display:inline-flex; align-items:center; text-align: center; justify-content:center; width:20px; height:20px; background-color:#eaeaea; border-radius:50%; background-repeat:no-repeat; background-position:center center; margin-right: 5px; }
.ctt_estimate .inner .bot_box .form-group .input_box.mail_type .help-block input:checked ~ label { background:var(--main_c1); color:#222; font-weight: 500; border: 1px solid transparent; }
.ctt_estimate .inner .bot_box .form-group .input_box.mail_type .help-block input:checked ~ label i { background-image:url(../../../img/chk_icon.png); background-color:var(--main_c1); }

.ctt_estimate .inner .bot_box .form-group .input_box.note { padding-bottom: 24px; height:235px; border-bottom: 2px solid #dadada !important; }
.ctt_estimate .inner .bot_box .form-group .input_box.note textarea { resize:none; height: 100%; background-attachment: local; background-image: linear-gradient(270deg, #fff 1px, transparent 0), linear-gradient(#fff 50px, #dadada 0); background-size: 4px 51px; line-height: 50px; border: 0 !important; padding-bottom: 5px; }

.ctt_estimate .inner .bot_box .form-group .input_box .file_box { display:flex; align-items:end; justify-content:space-between; }
.ctt_estimate .inner .bot_box .form-group .input_box .file_box .uname { color:#aaa; font-weight: 400; width:calc(100% - 150px - 10px); }
.ctt_estimate .inner .bot_box .form-group .input_box .file_box label { cursor:pointer; width:150px; height:55px; font-size:14px; color:#fff; font-weight: 500; display:inline-flex; align-items:center; justify-content:center; background:#999; margin-bottom: 0; }
.ctt_estimate .inner .bot_box .form-group .input_box .file_box label i { margin-left: 7px; }
.ctt_estimate .inner .bot_box .form-group .input_box .file_box input[type="file"] { position: absolute; width: 0; height: 0; padding: 0; overflow: hidden; border: 0; }

.ctt_estimate .inner .bot_box .form-group .input_box input:-ms-input-placeholder,
.ctt_estimate .inner .bot_box .form-group .input_box input::-webkit-input-placeholder,
.ctt_estimate .inner .bot_box .form-group .input_box input::-moz-placeholder,
.ctt_estimate .inner .bot_box .form-group .input_box input::-moz-placeholder { color: #fff !immportant; font-weight: 400 !immportant; }


.ctt_estimate .agree_box { margin-top: 3rem; }
.ctt_estimate .agree_box label { display:inline-flex; align-items:center; }
.ctt_estimate .agree_box input { margin-right: 7px; width:16px; height:16px; }
.ctt_estimate .agree_box a { border-bottom: 1px solid #aaa; box-sizing:border-box; display:inline-block; }
.ctt_estimate .agree_box label small { color:#de3d4c; }

.ctt_estimate .btn_box { text-align: center; margin-top: 3rem; }
.ctt_estimate .btn_box input { width:200px; height:55px; border-radius:5px; background:#222; color:#fff; font-weight: 600; font-size:16px; border: 0; }



/*
.ctt_estimate .inner {  }
.ctt_estimate .inner .flex_box { display:flex; margin-left: -6rem; margin-top: -5rem; }
.ctt_estimate .inner .flex_box .left,
.ctt_estimate .inner .flex_box .right { flex:1; padding-left: 6rem; box-sizing:border-box; }
.ctt_estimate .inner .flex_box .left {  }
.ctt_estimate .inner .flex_box .right {  }
*/


.ctt_maintance_request .qa_wrap { width:100%; max-width:1570px; margin: 0 auto; padding-top: 10rem; box-sizing:border-box; }
.ctt_maintance_request .flexBox { display:flex; }
.ctt_maintance_request .tit_box .tit { margin-bottom: 6rem; }
.ctt_maintance_request .stit_box { width:calc(500px + 5rem); padding-right: 5rem; box-sizing:border-box; flex-shrink:0; }
.ctt_maintance_request .stit_box .bot_box { display:flex; align-items:start; justify-content:start; flex-direction:column; position:sticky; top:80px; padding-top: 0; }
.ctt_maintance_request .stit_box .bot_box .left .stit { font-size:4rem; color:#3a3a3a; font-weight: 300; line-height: 1.2em; margin-bottom: 24px; }
.ctt_maintance_request .stit_box .bot_box .left .txt { font-size:14px; color:#222; line-height: 3rem; }
.ctt_maintance_request .stit_box .bot_box .left dl { display:flex; align-items:center; margin-bottom: 0; }
.ctt_maintance_request .stit_box .bot_box .left dl dt,
.ctt_maintance_request .stit_box .bot_box .left dl dd { font-size:14px; color:#222; }
.ctt_maintance_request .stit_box .bot_box .left dl dt {  }
.ctt_maintance_request .stit_box .bot_box .left dl dd { margin-left: 5px; }
.ctt_maintance_request .stit_box .bot_box .left dl dd a { border-bottom: 1px solid var(--main_c1); color:#222; display:inline-block; }
.ctt_maintance_request .stit_box .bot_box .right { display:flex; justify-content:start; margin-top: 5rem; padding-left: 0; width:100%; }
.ctt_maintance_request .stit_box .bot_box .right li { width:100%; max-width:130px; margin-right: 1rem; }
.ctt_maintance_request .stit_box .bot_box .right li a { width:100%; height:160px; display:flex; flex-direction:column; align-items:start; justify-content:space-between; box-sizing:border-box; padding: 27px 20px 20px; border-radius:5px; border: 2px solid transparent; transition:all 0.3s; }
.ctt_maintance_request .stit_box .bot_box .right li a .atit { font-size:14px; font-weight: 500; transition:all 0.3s; }
.ctt_maintance_request .stit_box .bot_box .right li a .btn { padding: 0; font-size:12px; font-weight: 500; transition:all 0.3s; }
.ctt_maintance_request .stit_box .bot_box .right li a .btn i { font-size:16px; margin-right: 5px; transition:all 0.3s; }

.ctt_maintance_request .stit_box .bot_box .right li.point {  }
.ctt_maintance_request .stit_box .bot_box .right li.point a { background:var(--main_c1); }
.ctt_maintance_request .stit_box .bot_box .right li.point a .atit { color:#222; }
.ctt_maintance_request .stit_box .bot_box .right li.point a .btn { color:#222; }

.ctt_maintance_request .stit_box .bot_box .right li.namecard {  }
.ctt_maintance_request .stit_box .bot_box .right li.namecard a { background:#000; }
.ctt_maintance_request .stit_box .bot_box .right li.namecard a .atit { color:#fff; }
.ctt_maintance_request .stit_box .bot_box .right li.namecard a .btn { color:#fff; }

.ctt_maintance_request .stit_box .bot_box .right li.point a:hover { border-color:var(--main_c1); background:#fff; }
.ctt_maintance_request .stit_box .bot_box .right li.namecard a:hover { border-color:#000 !important; background:#fff; }
.ctt_maintance_request .stit_box .bot_box .right li.point a:hover * { color:var(--main_c1); }
.ctt_maintance_request .stit_box .bot_box .right li.namecard a:hover * { color:#000; }

.ctt_maintance_request .qa_wrap .qa_tbl { width:calc(100% - (500px + 5rem)); margin-top: 5rem; }
.ctt_maintance_request .qa_wrap .qa_tbl .inner { border-top: 4px solid #222; border-bottom: 4px solid #222; box-sizing:border-box; }
.ctt_maintance_request .qa_wrap .qa_tbl li { border-top: 2px dotted #dadada; box-sizing:border-box; padding:3rem 2rem; display:flex; flex-direction:column; gap:10px; }
.ctt_maintance_request .qa_wrap .qa_tbl li:first-child { border-top: 0; }
.ctt_maintance_request .qa_wrap .qa_tbl li .topLine { display:flex; align-items:center; justify-content:space-between; }
.ctt_maintance_request .qa_wrap .qa_tbl li .topLine .left { display:flex; align-items:center; gap:2rem; }
.ctt_maintance_request .qa_wrap .qa_tbl li .topLine .left .num { font-size:1.8rem; color:#999; font-weight: 600; }
.ctt_maintance_request .qa_wrap .qa_tbl li .topLine .left .name { font-size:1.6rem; color:#666; }
.ctt_maintance_request .qa_wrap .qa_tbl li .topLine .value > span { font-size:14px; padding:8px 2rem; box-sizing:border-box; border-radius:1rem; font-weight: 500; }
.ctt_maintance_request .qa_wrap .qa_tbl li .topLine .value .status_0 { background:#eee; color:#999; }
.ctt_maintance_request .qa_wrap .qa_tbl li .topLine .value .status_1 { background:var(--main_c1); color:var(--main_c2); }

.ctt_maintance_request .qa_wrap .qa_tbl li .bottomLine { display:flex; justify-content:space-between; align-items:center; }
.ctt_maintance_request .qa_wrap .qa_tbl li .bottomLine .tit { font-size:1.8rem; color:#222; }
.ctt_maintance_request .qa_wrap .qa_tbl li .bottomLine .date { font-size:1.6rem; color:#666; }




@media (max-width:1600px){

	.ctt_security .section01 .img_box { align-items:center; }
	.ctt_security .section01 .img_box dt { flex-shrink:1; }
	.ctt_security .section01 .img_box dd { padding-top: 0; }

	.ctt_security .section01 .info_box dt,
	.ctt_security .section01 .info_box dd { width:50%; flex-shrink:0; }
	.ctt_security .section01 .info_box dt {  }


	.ctt_estimate form { padding-left: 0; }
	.ctt_estimate form .bot_box .left { padding-right: 1rem; }
	.ctt_estimate form .bot_box .right { padding-left: 1rem; }
	
	
	.ctt_maintance_request .qa_wrap { padding-left: 15px; padding-right: 15px; box-sizing:border-box; }
	
	.ctt_maintance_request .flexBox { padding-left: 0; }
	.ctt_maintance_request .flexBox .bot_box .left { padding-right: 1rem; }
	.ctt_maintance_request .flexBox .bot_box .right { padding-left: 1rem; }


}


@media (max-width:1400px){

	.ctt_security .section02 .list_box .box { width:25%; padding-left: 5px; padding-right: 5px; flex-shrink:0; }
	.ctt_security .section02 .list_box .box .inner { max-width:320px; width:100%; }
	.ctt_security .section02 .list_box .box .tit { font-size:30px; }
	.ctt_security .section02 .list_box .box .tit span { font-size:26px; }
	.ctt_security .section02 .list_box .box .txt br { display:none; }


	.ctt_estimate .stit_box { width:calc(450px + 5rem); }
	.ctt_estimate form { width: calc(100% - 450px); }
	
	
	.ctt_maintance_request .stit_box { width:450px; }
	.ctt_maintance_request .qa_wrap .qa_tbl { width: calc(100% - 450px); }
	.ctt_maintance_request .stit_box .bot_box .left .stit br { display:none; }


}


@media (max-width:1200px){

	.ctt_security .sub_tit .txt br { display:none; }

	.ctt_security .section01 .img_box { flex-direction:column; }
	.ctt_security .section01 .img_box dt {  }
	.ctt_security .section01 .img_box dd { width:100%; text-align: center; margin-top: 30px; padding-left: 0; }

	.ctt_security .section02 .list_box .box .txt br { display:none; }


	.work .filter_wrap { margin-top: 0; }
	.work .filter_wrap article { width:33.33%; margin-top: 5rem; }


	.ctt_estimate .sticky_wrap { flex-wrap:wrap; }
	.ctt_estimate .stit_box { width:100%; }
	.ctt_estimate .stit_box .bot_box { position:static; flex-direction:row; justify-content:space-between; align-items:end; }
	.ctt_estimate .stit_box .bot_box .right { width:280px; }
	.ctt_estimate .stit_box .bot_box .right li { margin-right: 0; margin-left: 10px; }

	.ctt_estimate form { width: 100%; }
	
	
	.ctt_maintance_request .flexBox { flex-wrap:wrap; }
	.ctt_maintance_request .stit_box { width:100%; padding-right: 0; }
	.ctt_maintance_request .stit_box .bot_box { position:static; flex-direction:row; justify-content:space-between; align-items:anchor-center; }
	.ctt_maintance_request .stit_box .bot_box .left .stit br { display:block; }
	.ctt_maintance_request .stit_box .bot_box .right { width:280px; }
	.ctt_maintance_request .stit_box .bot_box .right li { margin-right: 0; margin-left: 10px; }

	.ctt_maintance_request .qa_wrap .qa_tbl { width: 100%; }


 
}


@media (max-width:992px){

	.ctt_security .section01 .info_box { flex-direction:column; }
	.ctt_security .section01 .info_box dt,
	.ctt_security .section01 .info_box dd { width:100%; padding: 0; border: 0; text-align:left; }
	.ctt_security .section01 .info_box dd { margin-top: 10px; }

	.ctt_security .section02 .list_box { flex-wrap:wrap; }
	.ctt_security .section02 .list_box .box { width:50%; padding: 5px; }
	.ctt_security .section02 .list_box .box .inner { max-width:100%; }

}


@media (max-width:768px){

	.ctt_security .section01 .img_box dt { width:100%; }
	.ctt_security .section01 .img_box .tit_box { font-size:20px; max-width: 250px; height: 130px; }

	.ctt_contact .tit_box .txt br { display:none; }
	.ctt_contact .section01 .info_box .info { padding-right: 0; }


	.ctt_estimate .stit_box .bot_box { flex-direction:column; justify-content:space-between; align-items:start; }
	.ctt_estimate .stit_box .bot_box .right { width:100%; }
	.ctt_estimate .stit_box .bot_box .right li { max-width:calc(50% - 10px); margin: 0 5px; }
	.ctt_estimate .stit_box .bot_box .right li a { flex-direction:row; height:auto; align-items:center; padding: 20px; }
	.ctt_estimate .stit_box .bot_box .right li a .atit br { display:none; }

	.ctt_estimate form .bot_box { flex-wrap:wrap; }
	.ctt_estimate form .bot_box .left,
	.ctt_estimate form .bot_box .right { flex:none; width:100%; }
	.ctt_estimate form .bot_box .left { padding-right: 0; }
	.ctt_estimate form .bot_box .right { padding-left: 0; padding-top: 3.5rem; }
	
	
	.ctt_maintance_request .stit_box .bot_box { flex-direction:column; justify-content:space-between; align-items:start; }
	.ctt_maintance_request .stit_box .bot_box .right { width:100%; padding-left: 0; }
	.ctt_maintance_request .stit_box .bot_box .right li { max-width:calc(50% - 10px); margin: 0 5px; }
	.ctt_maintance_request .stit_box .bot_box .right li a { flex-direction:row; height:auto; align-items:center; padding: 20px; }
	.ctt_maintance_request .stit_box .bot_box .right li a .atit br { display:none; }
	
	.ctt_maintance_request .qa_wrap .qa_tbl li .bottomLine { flex-direction:column; align-items:start; gap:5px; }


}


@media (max-width:640px){

	.work .filter_wrap article { width:50%; }

}


@media (max-width:560px){

	.ctt_security .section02 .list_box .box { width:100%; }

}


@media (max-width:479px){

	.work .filter_wrap article a .txt_box { padding-left: 0; }
	.work .filter_wrap article a .txt_box .name { font-size:1.8rem; }


	.ctt_estimate .stit_box .bot_box .right { flex-direction:column; }
	.ctt_estimate .stit_box .bot_box .right li { width:100%; max-width:100%; margin: 0; margin-top: 5px; }
	.ctt_estimate .stit_box .bot_box .right li:first-child { margin-top: 0; } 

	.ctt_estimate .inner .bot_box .form-group .input_box.mail_type { flex-wrap:wrap; }
	.ctt_estimate .inner .bot_box .form-group .input_box.mail_type > .imt { width:100%; margin-right: 0; }
	.ctt_estimate .inner .bot_box .form-group .input_box.mail_type .help-block { margin-top: 5px; height:35px; }
	
	
	.ctt_maintance_request .stit_box .bot_box .left .stit br { display:none; }
	.ctt_maintance_request .stit_box .bot_box .right { flex-direction:column; }
	.ctt_maintance_request .stit_box .bot_box .right li { width:100%; max-width:100%; margin: 0; margin-top: 5px; }
	.ctt_maintance_request .stit_box .bot_box .right li:first-child { margin-top: 0; } 
	


}