/* A A A : A : A : A : */ #dhnco_sub3-2 { width : 100%; height : auto; text-align : center; margin : clamp(40px,8vw,80px) 0;} #dhnco_sub3-2 .logoBox { width : 100%; height : auto; } #dhnco_sub3-2 .logoBox img { width : clamp(35px,10vw,65px); height : auto; } #dhnco_sub3-2 .sectionTit { width : auto; height : auto; display : inline-flex; flex-direction : column; align-items : center; margin-top : clamp(3px,1vw,8px); padding : 0 8px; } .dhncoSub .sectionTit.noMargin { display : flex;} .dhncoSub .sectionTit.noMargin .underLine { width : clamp(40px,5vw,90px); height : clamp(4px,1vw,6px); background : #31a09b; } #dhnco_sub3-2 .sectionTit p { font-size : clamp(23px,2vw,36px); font-weight : 700; color : #31a09b80; line-height : 2.1em; word-break : keep-all; } #dhnco_sub3-2 .sectionTit .titB { font-size : clamp(20px,2vw,29px); font-weight : 700; color : #31a09b; line-height : 1em; margin : 0.7em 0; } #dhnco_sub3-2 .sectionTit .underLine { width : 50%; height : clamp(4px,1vw,6px); background : #31a09b; } #dhnco_sub3-2 .grayBackWrap { width : 100%; height : auto; background : #EEEFEF; padding : clamp(40px,8vw,80px) 8px;} #dhnco_sub3-2 .whiteBackWrap { width : 100%; height : auto; background : #fff; padding : clamp(40px,8vw,80px) 8px;} #dhnco_sub3-2 .firstWrap { margin-top : clamp(40px,3vw,50px); } #dhnco_sub3-2 .listWrap { width : 100%; height : auto; display : flex; align-items : center; justify-content : center; max-width : 1000px; margin : 0 auto; margin-top : clamp(18px,2vw,28px);} #dhnco_sub3-2 .listWrap:first-child { margin-top : 0; } #dhnco_sub3-2 .listWrap .listBox { width : clamp(200px,15vw,260px); height : 230px; display : flex; flex-direction : column; justify-content : center; align-items : center; margin-right : clamp(10px,1vw,15px); } #dhnco_sub3-2 .listWrap .listBox:nth-child(3n) { margin-right : 0;} #dhnco_sub3-2 .listWrap .listBox .imgBox { width : 100%; height : 17%; display : flex; flex-direction : column; justify-content : center; align-items : center; } #dhnco_sub3-2 .listWrap .listBox .imgBox img { width : 100%; height : 100%; object-fit : contain;} #dhnco_sub3-2 .listWrap .listBox .textWrap { width : 100%; height : 78%; display : flex; flex-direction : column; justify-content : flex-start; align-items : center; } #dhnco_sub3-2 .listWrap .listBox .textWrap .tit { width : 60%; height : auto; font-size : clamp(15px,2vw,18px); color : #fff; margin-top : 3px; padding : 0.5em 0; line-height : 1em; } #dhnco_sub3-2 .listWrap .listBox .textWrap .tit.a { background : #43D1A1; } #dhnco_sub3-2 .listWrap .listBox .textWrap .tit.b { background : #9ED443;} #dhnco_sub3-2 .listWrap .listBox .textWrap .tit.c { background : #40D4E2;} #dhnco_sub3-2 .listWrap .listBox .textWrap .tit.d { background : #41A7E1;} #dhnco_sub3-2 .listWrap .listBox .textWrap .tit.e { background : #4383DD;} #dhnco_sub3-2 .listWrap .listBox .textWrap .tit.f { background : #6341B7;} #dhnco_sub3-2 .listWrap .listBox .textWrap .tit.g { background : #B76BED;} #dhnco_sub3-2 .listWrap .listBox .textWrap .tit.h { background : #D36244;} #dhnco_sub3-2 .listWrap .listBox .textWrap .tit.i { background : #E567B8;} #dhnco_sub3-2 .listWrap .listBox .textWrap .tit.j { background : #00A85F;} #dhnco_sub3-2 .listWrap .listBox .textWrap .textBox { width : 100%; height : auto; flex-grow : 1; display : flex; align-items : center; justify-content : center; padding : 0 clamp(15px,1vw,25px); background : #fff; } #dhnco_sub3-2 .listWrap .listBox .textWrap .textBox p { font-size : clamp(14px,2vw,16px); word-break : keep-all; text-align : left; } #dhnco_sub3-2 .contentWrap { width : 100%; height : auto; display : flex; flex-direction : column; align-items : center; } #dhnco_sub3-2 .contentWrap .tit { font-size : clamp(16px,2vw,24px); font-weight : 500; color : #fff; background : #31A09B; display : inline-block; line-height : 1em; padding : 0.5em 1em; word-break : keep-all; } #dhnco_sub3-2 .contentWrap .listBoxB { width : auto; height : auto; display : inline-block; border : 1px solid #31A09B; padding : clamp(15px,3vw,25px) clamp(20px,3vw,50px); margin : 0 auto; flex-wrap : wrap; justify-content : center; } #dhnco_sub3-2 .contentWrap .listBoxB .pWrap { width : auto; display : inline-block; text-align : left; float : left; } #dhnco_sub3-2 .contentWrap .listBoxB .pWrap:first-child { margin-right : clamp(25px,2vw,38px); } #dhnco_sub3-2 .contentWrap .listBoxB .pWrap.noMargin { margin-right : 0; } #dhnco_sub3-2 .contentWrap .listBoxB .pWrap.floatNone { float : none; display : block;} #dhnco_sub3-2 .contentWrap .listBoxB .pWrap p { font-size : clamp(14px,2vw,18px); word-break : keep-all; } @media (max-width:640px) { /* **************************************************************************************************************************************************************************** */ /* */ /* */ /* 1단 배경 Fixed */ /* */ /* */ /* **************************************************************************************************************************************************************************** */ /* A A A : A : A : A : */ #dhnco_sub3-2 .sectionTit p { line-height : 1.3em; margin : 0.3em 0 0.5em;} #dhnco_sub3-2 .listWrap { flex-direction : column; margin-top : 0; } #dhnco_sub3-2 .listWrap .listBox { margin-right : 0; margin-bottom : 15px;} #dhnco_sub3-2 .listWrap:last-child .listBox:last-child { margin-bottom : 0;} #dhnco_sub3-2 .contentWrap .listBoxB { display : inline-flex; justify-content : flex-start;} #dhnco_sub3-2 .contentWrap .listBoxB .pWrap p { text-indent : -0.7em; margin-left : 0.7em; } }