#container { width:100% }

figure {margin:0; padding:0;}
button {border:0; padding:20px 40px; background: #ffcd4a; color:#3742ac; box-shadow: 4px 3px 0px #3742ac; border-radius: 20px; margin:20px; }

.textcenter {text-align: center;}
.centerbox.m20 {margin:20px auto;}
.font20 {font-size:18px; line-height: 1.5;}
.font30 {font-size:24px; line-height: 2; font-weight: 700; margin-top:20px;}
.backgroundset {background:#f3f9ff}
p.contents {line-height: 2; font-size:24px;}
p.contents_service {color:#ff5300; line-height: 2.5; font-size:20px !important;}
p.contents_service span {font-weight: 700; color:#868686; font-size:18px !important;}
h4.subtitle {font-size:26px; font-weight: 900; line-height: 2;}
article.tables {border:1px solid #eee;}
article.tables ul {flex-direction: row; align-items:center; justify-content: space-between; padding:15px}
article.tables > ul.fs li { width: calc(100% / 3); text-align: center}
article.tables ul li {font-size:18px;}
article.tables ul.clos {flex-direction: column; align-items:flex-start}
li.points {color:red; font-weight: 900;}

.widebox {padding:100px 0; border-bottom:1px solid #eee}
.centerbox {width:1200px; margin:0 auto; padding:0;}
.centerbox h2 {color:#ffcd4a; font-size:70px; font-weight: 900; text-shadow: 4px 3px 0px #3742ac; line-height:1.5}
.centerbox h2.font20 {font-size:35px; text-align:center; margin:30px 0 0; text-shadow: 3px 2px 0px #3742ac;}

.twobox {display:flex; width:1200px; margin:40px auto;}
.twobox ul {display:flex; flex-direction: column; gap:40px; }
.twobox ul.nav {position: sticky; top:0; height:100%; width:310px;}
.twobox ul li { font-size:20px; cursor: pointer; color:#7b7b7b;}
.twobox ul li.active {color:#000; font-weight: 900; }
.twobox > div {display:flex}
.twobox > div::before {content: ''; width:1px; background-color:#ffcd4a; height:120px; margin:23% 40px;}
.twobox > div > div {display:none; width:calc(1200px - 310px - 80px); text-align: center;}
.twobox > div > div img {width:100%; object-fit: cover;}
.twobox > div > div p {font-size:16px;}
.twobox > div > div h3 {font-size:40px; font-weight: 900; line-height: 1.5; margin-bottom:40px;}
.twobox > div > div > ul {display:flex; justify-content: space-between; gap:20px; margin:40px 0; flex-direction: row;}
.twobox > div > div > ul > li > figure > p {height: 100px;}
.twobox > div > div > ul > li > figure > p img {height:100%; width:100px;}
.twobox > div > div > ul > li > figure > figcaption { font-size:20px; font-weight: 900; margin-top:20px; text-align: center; color:red; }

.windowhosting {color:#000; padding: 30px 0 92px 0;background:url('https://www.dotname.co.kr/assets/images/idc/desktop/211007_hosting_ser_760S2_2.jpg');background-repeat: no-repeat; background-size: 100% 100%;}
.windowhosting h3 { color:#0063B7; margin-top: 20px; text-align: center; font-size:24px !important; }
.windowhosting h3 img {width:20px !important; margin-right:10px;}
.windowhosting ul {text-align: center;}

.swiper-container { width: 100%; height: 500px; }
.swiper-slide { text-align: center; font-size: 18px; background: #fff; display: flex; justify-content: center; align-items: center; }
.swiper-container img {width:100%;}

.fax_box {display: flex; padding:15px; justify-content: space-between; align-items:center}
.fax_box p {line-height: 2;}
p.gr {    clear: both;
    font-size: 17px;
    padding: 15px 0;
    background-color: #7ee8fa;
    background-image: linear-gradient(315deg, #7ee8fa 0%, #80ff72 74%);}


ul.smsul {display:flex; padding:20px; justify-content: space-between; align-items:center; flex-direction: row;}
ul.smsul li { width:50%; }
ul.twobox {display:flex; flex-wrap: wrap; width:100%;}
ul.twobox > li {    width: 100%;
    height: 100px;
    border: 1px solid #eee;
    display: flex;
    justify-content: center;
    align-items: center;}
ul.twobox > li img {}


.adobe_svc {
    padding: 64px 68px;
    color: #fff;
    background: url(/assets/images/adobe_cloud/adobe_svc_bg.jpg) no-repeat;
    background-size:100%;
}
.adobe_svc h3 {
    font-size: 32px;
}
.adobe_svc p.sub {
    font-size: 16px;
}
.adobe_svc a {
    display: inline-block;
    padding: 10px 60px;
    border: 1px solid #fff;
    border-radius: 100px;
    color: #fff;
}
.adobe_svc h4 {
    margin-bottom: 20px;
    color: #9999FF;
    font-size: 24px;
}
.adobe_svc .plus {
    display: inline-block;
    width: 26px;
    height: 26px;
    background: url(/assets/images/adobe_cloud/adobe_svc_icon_plus.png) no-repeat center;
    vertical-align: sub;
}
.adobe_svc ul {
    display: flex;
    flex-wrap: wrap;
}
.adobe_svc li {
    width: 50%;
    display: inline-flex;
    align-items: center;
}