.s2-hancom .jb-background { padding: 100px 0px 100px 0px }


.s2-hancom h2 {margin: 0px 0px 20px 0px; text-align: center; font-size: 48px; font-weight: 600; line-height: 1.7; }
.s2-hancom h3 { margin: 0px 0px 0px 0px; text-align: left; font-size: 38px; font-weight: 600; }
.s2-hancom h4 { margin: 0px 0px 50px 0px; text-align: left; font-size: 38px; font-weight: 600; }
.s2-hancom h5 { margin: 0px 0px 25px 0px; text-align: center; font-size: 45px; font-weight: 600; }
.s2-hancom h6 { margin: 0px 0px 20px 0px; text-align: center; font-size: 38px; font-weight: 600; }



.s2-hancom .s2-paragraph-01 {font-size: 32px; font-weight: 600; margin-top: 100px; margin-bottom: 60px; }
.s2-hancom .s2-paragraph-02 {font-size: 18px; font-weight: 100; margin-top: 20px; margin-bottom: 50px; text-align: left; }

.s2-hancom .s2-paragraph-06 {font-size: 24px; font-weight: 400; margin: 20px 0px 60px 0px; text-align: center; }
.s2-hancom .s2-paragraph-07 {font-size: 18px; font-weight: 100; margin: 20px 0px 0px 0px; text-align: center; }
.s2-hancom .s2-paragraph-08 {font-size: 18px; font-weight: 100; margin: 20px 0px 80px 0px; text-align: center; }

.s2-hancom .s2-grid-logo img { width: 65px; }



.s2-hancom .s2-title-color-hwp { color: #245DD9; font-weight: 600; }
.s2-hancom .s2-title-color-cell { color: #12746A; font-weight: 600; }
.s2-hancom .s2-title-color-show { color: #F77446; font-weight: 600; }
.s2-hancom .s2-title-color-word { color: #5514D2; font-weight: 600; }
.s2-hancom .s2-title-color-pdf { color: #EA5E95; font-weight: 600; }


.s2-hancom .s2-background-solution-01 { background-image: url( "/wp-content/uploads/hancom-new-bg.png" ); background-size: cover; background-repeat: no-repeat; background-position: center; }




.s2-hancom .s2-grid-txt-group { padding: 20px; }
.s2-hancom  p.s2-grid-title { margin: 0px; text-align: left; font-weight: 500; font-size: 22px; }
.s2-hancom .s2-grid-txt { margin-top: 20px; font-weight: 200; font-size: 14px; line-height: 26px; color: #212121; }











/* 1x1-main */



.s2-hancom .s2-paragraph-05 { font-size: 17px; text-align: center; font-weight: 400; color: #7A7C85; margin-top: 50px; }


.s2-hancom .s2-grid-box-1x1-group { text-align: center; margin-top: 30px; }
.s2-hancom .s2-grid-box-1x1-group p { display: inline-block; background-color: #F5F6F8; padding: 5px 10px; font-weight: 600; font-size: 14px; border-radius: 5px; margin: 5px 5px; }


/* 1x1-main */











/* 3xn-main */

.s2-hancom .s2-grid-box-3xn-main { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-template-rows: 1fr; grid-column-gap: 20px; grid-row-gap: 20px; }
@media ( max-width: 767px ) {
	.s2-hancom .s2-grid-box-3xn-main { grid-template-columns: 1fr 1fr;  grid-column-gap: 20px; grid-row-gap: 20px; }
}

.s2-hancom .s2-grid-box-3xn-main .s2-grid-item-01 { background-color: #ffffff; border-radius: 10px; overflow-x: auto; box-shadow: 0 5px 15px rgb(0 0 0 / 5%); border: 1px solid #eeeeee;}


.s2-hancom .s2-grid-box-3xn-main .s2-grid-txt-group { padding: 20px; }





.s2-hancom .s2-grid-box-3xn-main .s2-grid-item-01 .s2-grid-icon { font-size: 65px; font-weight: 700; color: #30A8FB; }
.s2-hancom .s2-grid-box-3xn-main .s2-grid-item-01 .s2-grid-img { margin: 0px; }


.s2-hancom .s2-grid-box-3xn-main .s2-grid-item-01 p.s2-grid-title { margin: 0px; text-align: left; font-weight: 500; font-size: 22px; }
.s2-hancom .s2-grid-box-3xn-main .s2-grid-item-01 .s2-grid-txt { margin-top: 20px; font-weight: 200; font-size: 14px; line-height: 26px; color: #212121; }



.s2-hancom .s2-grid-box-3xn-main .s2-grid-item-01 .s2-grid-ul li { position: relative; list-style: none; font-size: 14px; font-weight: 100; }
.s2-hancom .s2-grid-box-3xn-main .s2-grid-item-01 .s2-grid-ul li::before { content: ''; position: absolute; left: -15px; top: 10px; width: 4px; height: 4px; background-color: #183C6E; border-radius: 50%; }



/* 3xn-main */












/* 3xn .s2-grid-box-3xn-title */


.s2-hancom .s2-grid-box-3xn-title { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-template-rows: 1fr; grid-column-gap: 20px; grid-row-gap: 20px; margin-top: 80px; }
@media ( max-width: 767px ) {
	.s2-hancom .s2-grid-box-3xn-title { grid-template-columns: 1fr 1fr;  grid-column-gap: 20px; grid-row-gap: 20px; }
}

.s2-hancom .s2-grid-box-3xn-title .s2-grid-item { padding: 25px 25px;  border-radius: 10px; overflow-x: auto; box-shadow: 0 5px 15px rgb(0 0 0 / 5%); border: 1px solid #eeeeee;}




/*.s2-hancom .s2-grid-box-3xn-title table.s2-mm-table { padding: 30px; width: 100%; height: 100%; border-spacing: 0; border-collapse: collapse;  }*/


.s2-hancom .s2-grid-box-3xn-title table.s2-mm-table tr td .s2-grid-new { display: block;  text-align: center; }
.s2-hancom .s2-grid-box-3xn-title table.s2-mm-table tr td .s2-grid-new .s2-grid-new-text {display: inline-block; text-align: center; font-weight: 500; font-size: 11px; color: #F36E23; background-color: #FDEDE9; padding: 3px 10px; border-radius: 5px; font-weight: 600;}

.s2-hancom .s2-grid-box-3xn-title table.s2-mm-table tr td .s2-grid-new .s2-grid-new-text-02 {display: inline-block; text-align: center; font-weight: 500; font-size: 11px; color: #ffffff; background-color: #ffffff; padding: 3px 10px; border-radius: 5px; font-weight: 600;}



.s2-hancom .s2-grid-box-3xn-title table.s2-mm-table tr td .s2-grid-title { text-align: center; font-weight: 500; font-size: 20px; }
.s2-hancom .s2-grid-box-3xn-title table.s2-mm-table tr td .s2-grid-text { text-align: center; font-weight: 100; font-size: 15px;  margin-top: 20px;  }



.s2-hancom .s2-grid-box-3x1-group { margin-top: 50px; }
.s2-hancom .s2-grid-box-3x1-group p { display: inline-block; background-color: #F5F6F8; padding: 5px 10px; font-weight: 500; font-size: 14px; border-radius: 5px; margin: 5px 5px; }



/* 3xn .s2-grid-box-3xn-title */
















/* 2x1-main-02 */

.s2-hancom .s2-grid-box-2x1-main-02 { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr; grid-column-gap: 60px; grid-row-gap: 20px; align-items: center;}


@media (max-width: 767px) {
    .s2-hancom .s2-grid-box-2x1-main-02 {
        grid-template-columns: 1fr;
        grid-column-gap: 20px;
        grid-row-gap: 0px;
    }
}


.s2-hancom .s2-grid-box-2x1-main-02 .s2-column-content-main-01 img { width: 600px; }
.s2-hancom .s2-grid-box-2x1-main-02 .s2-column-content-main-02 .s2-logo img { width: 75px; margin-left: 15px; }
.s2-hancom .s2-grid-box-2x1-main-02 .s2-column-content-main-02 .s2-title-img img  { width: 80%; margin-top: 15px; }
.s2-hancom .s2-grid-box-2x1-main-02 .s2-column-content-main-02 .s2-title-img-02 img  { width: 250px; margin: 0px; }
.s2-hancom .s2-grid-box-2x1-main-02 .s2-column-content-main-02 .s2-title-img-03 img  { width: 100%; }

.s2-hancom .s2-grid-box-2x1-main-02 .s2-column-content-main-02 .s2-title-group p { display: inline-block; }


.s2-hancom .s2-grid-box-2x1-main-02 .s2-column-content-main-02 .s2-title  { font-size: 38px; font-weight: 600; }

.s2-hancom .s2-grid-box-2x1-main-02 .s2-column-content-main-02 .s2-text  { font-size: 18px; font-weight: 100; margin-top: 30px; }



/* 2x1-main-02 */













/* 2xn */

.s2-hancom .s2-grid-box-2xn-g { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr; grid-column-gap: 40px; grid-row-gap: 40px; }
@media ( max-width: 767px ) {
	.s2-hancom .s2-grid-box-2xn-g { grid-template-columns: 1fr 1fr;  grid-column-gap: 20px; grid-row-gap: 20px; }
}

.s2-hancom .s2-grid-box-2xn-g .s2-grid-item-01 { background-color: #ffffff; border-radius: 10px; overflow-x: auto; box-shadow: 0 5px 15px rgb(0 0 0 / 5%); border: 1px solid #eeeeee;}


.s2-hancom .s2-grid-box-2xn-g .s2-grid-txt-group { padding: 20px; }


.s2-hancom .s2-grid-box-2xn-g .s2-grid-item-01 .s2-grid-icon { font-size: 65px; font-weight: 700; color: #30A8FB; }
.s2-hancom .s2-grid-box-2xn-g .s2-grid-item-01 .s2-grid-img { margin: 0px; }


.s2-hancom .s2-grid-box-2xn-g .s2-grid-item-01 p.s2-grid-title { margin: 0px; text-align: left; font-weight: 500; font-size: 22px; }
.s2-hancom .s2-grid-box-2xn-g .s2-grid-item-01 .s2-grid-txt { margin-top: 20px; font-weight: 200; font-size: 14px; line-height: 26px; color: #212121; }



.s2-hancom .s2-grid-box-2xn-g .s2-grid-item-01 .s2-grid-ul li { position: relative; list-style: none; font-size: 14px; font-weight: 100; }
.s2-hancom .s2-grid-box-2xn-g .s2-grid-item-01 .s2-grid-ul li::before { content: ''; position: absolute; left: -15px; top: 10px; width: 4px; height: 4px; background-color: #183C6E; border-radius: 50%; }



/* 2xn */








/* 3xn */

.s2-hancom .s2-grid-box-3xn-g { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-template-rows: 1fr; grid-column-gap: 20px; grid-row-gap: 20px; }
@media ( max-width: 767px ) {
	.s2-hancom .s2-grid-box-3xn-g { grid-template-columns: 1fr 1fr;  grid-column-gap: 20px; grid-row-gap: 20px; }
}

.s2-hancom .s2-grid-box-3xn-g .s2-grid-item-01 { background-color: #ffffff; border-radius: 10px; overflow-x: auto; box-shadow: 0 5px 15px rgb(0 0 0 / 5%); border: 1px solid #eeeeee;}


.s2-hancom .s2-grid-box-3xn-g .s2-grid-txt-group { padding: 20px; }





.s2-hancom .s2-grid-box-3xn-g .s2-grid-item-01 .s2-grid-icon { font-size: 65px; font-weight: 700; color: #30A8FB; }
.s2-hancom .s2-grid-box-3xn-g .s2-grid-item-01 .s2-grid-img { margin: 0px; }


.s2-hancom .s2-grid-box-3xn-g .s2-grid-item-01 p.s2-grid-title { margin: 0px; text-align: left; font-weight: 500; font-size: 22px; }
.s2-hancom .s2-grid-box-3xn-g .s2-grid-item-01 .s2-grid-txt { margin-top: 20px; font-weight: 200; font-size: 14px; line-height: 26px; color: #212121; }



.s2-hancom .s2-grid-box-3xn-g .s2-grid-item-01 .s2-grid-ul li { position: relative; list-style: none; font-size: 14px; font-weight: 100; }
.s2-hancom .s2-grid-box-3xn-g .s2-grid-item-01 .s2-grid-ul li::before { content: ''; position: absolute; left: -15px; top: 10px; width: 4px; height: 4px; background-color: #183C6E; border-radius: 50%; }



/* 3xn */
















@media ( max-width: 1280px ) {


}

@media ( max-width: 1024px ) {
.s2-hancom h2 { font-size: 40px; }
.s2-hancom h5 { font-size: 40px; }
.s2-hancom h3, 
.s2-hancom h4 { font-size: 32px; }
.s2-hancom .s2-paragraph-06 { font-size: 20px; }
.s2-hancom .s2-grid-box-3xn-main .s2-grid-item-01 p.s2-grid-title { font-size: 20px; }
.s2-hancom .s2-grid-box-3xn-title table.s2-mm-table tr td .s2-grid-title { font-size: 18px; }
.s2-hancom .s2-grid-box-3xn-title table.s2-mm-table tr td .s2-grid-text { font-size: 14px; }
.s2-hancom .s2-grid-box-2x1-main-02 .s2-column-content-main-02 .s2-title {font-size: 28px;}
.s2-hancom .s2-grid-box-2x1-main-02 .s2-column-content-main-02 .s2-title-img-02 img { width: 50%; }
.s2-hancom .s2-grid-box-2xn-g .s2-grid-item-01 p.s2-grid-title { font-size: 18px; }
.s2-hancom .s2-grid-box-3xn-g .s2-grid-item-01 p.s2-grid-title { font-size: 18px; }

}

@media ( max-width: 767px ) {


}


@media ( max-width: 430px ) {
	
.s2-hancom h2 { font-size: 35px; }
.s2-hancom h5 { font-size: 32px; }
.s2-hancom h3, 
.s2-hancom h4 { font-size: 26px; }
    .s2-hancom .s2-grid-box-3xn-g,
    .s2-hancom .s2-grid-box-2xn-g, 
    .s2-hancom .s2-grid-box-3xn-title,
    .s2-hancom .s2-grid-box-3xn-main { grid-template-columns: 1fr; }

    .s2-hancom .s2-grid-box-2x1-main-02 .s2-column-content-main-02 .s2-title-img-02 img { width: 40%; }
    .s2-hancom .s2-paragraph-06 { font-size: 18px; }
    


}










