@charset "utf-8";

/* 개인정보변경신청서 */
[data-content="1"]{position:relative; margin-top:3em;}
[data-content="1"]:after{content:""; display:block; clear:both;}
[data-content="1"]>ul>li{float:left; width:calc((100% - 1px - 2em) / 2); padding:3.333em; margin-right:2em; text-align:center;}
[data-content="1"]>ul>li:before{
    content:""; position:absolute; left:0; top:0; z-index:0; width:calc((100% - 1px - 2em) / 2); height:100%; background-color:#F3F5FE;
    -webkit-border-radius:0.266em 0.266em 4em 0.266em;
    border-radius:0.266em 0.266em 4em 0.266em;
}
[data-content="1"]>ul>li:last-child:before{left:auto; right:0;}
[data-content="1"]>ul>li:last-child{margin-right:0;}
[data-content="1"]>ul>li>.head,
[data-content="1"]>ul>li>.midd{position:relative; z-index:50;}
[data-content="1"]>ul>li>.head>strong{display:block; line-height:1.3; font-size:1.733em; color:#2B4381;}
[data-content="1"]>ul>li>.midd{position:relative; margin-top:2em;}
[data-content="1"]>ul>li>.midd:before{
    content:""; display:block; width:8em; height:8em; margin:0 auto 2em; background:#FFFFFF; background-repeat:no-repeat; background-position:center center; background-size:contain;
    -webkit-border-radius:50%;
    border-radius:50%;
    -webkit-box-shadow: 0 1.066em 1.6em -0.533em rgba(80, 120, 231, 0.2);
    box-shadow: 0 1.066em 1.6em -0.533em rgba(80, 120, 231, 0.2);
}
[data-content="1"]>ul>li:nth-child(1)>.midd:before{background-image:url(../../../images/site/enter/content/content_1_simbol_1.svg);}
[data-content="1"]>ul>li:nth-child(2)>.midd:before{background-image:url(../../../images/site/enter/content/content_1_simbol_2.svg);}
[data-content="1"]>ul>li>.midd[data-icon="1"]:before{background-image:url(../../../images/site/enter/content/content_1_simbol_3.svg);}
[data-content="1"]>ul>li>.midd[data-icon="2"]:before{background-image:url(../../../images/site/enter/content/content_1_simbol_4.svg);}
[data-content="1"]>ul>li>.midd>em{line-height:1.6; font-style:normal; font-weight:normal; font-size:1.066em; color:#5078E7;}
[data-content="1"]>ul>li>.midd>span{display:inline-block;}

@media screen and (max-width: 650px) {
    [data-content="1"]>ul>li{float:none; position:relative; width:100%; margin-right:0;}
    [data-content="1"]>ul>li:before{width:100%;}
    [data-content="1"]>ul>li:nth-child(n+2){margin-top:2em;}
}
@media screen and (max-width: 450px) {
    [data-content="1"]>ul>li>.midd{margin-top:1em;}
    [data-content="1"]>ul>li>.midd:before{font-size:0.7em;}
}
@media screen and (max-width: 400px) {
    [data-content="1"]>ul>li{padding:2em;}
}


/* 학부 소개 */
[data-box="info"]{
    position:relative; padding:1em 2em; border:1px solid #C5C9D6;
    -webkit-border-radius:0.333em;
    border-radius:0.333em;
}
[data-box="info"]>ul>li{position:relative; padding-left:6.5em;}
[data-box="info"]>ul>li>strong{display:block; position:absolute; left:0; top:1em; width:5.5em; font-size:1.066em; color:#2B4381;}
[data-box="info"]>ul>li>div{width:100%;}
[data-box="info"]>ul>li>div>ul>li{position:relative; z-index:0; line-height:2em; padding:0;}
[data-box="info"]>ul>li>div>ul>li[data-open="on"]{z-index:100;}
[data-box="info"]>ul>li>div>ul>li>strong{display:block; position:relative; z-index:0; padding:1em 9em 1em 0; font-weight:400; font-size:1.066em; border-bottom:1px dashed #C5C9D6; color:#555;}
[data-box="info"]>ul>li:last-child>div>ul>li:last-child>strong{border-bottom:none;}
[data-box="info"]>ul>li>div>ul>li>div{position:absolute; right:0; top:1em; z-index:10;}
[data-box="info"]>ul>li>div>ul>li>div:after{content:""; display:block; clear:both;}
[data-box="info"]>ul>li>div>ul>li>div>div{display:block; float:left; position:relative; width:2em; height:2em; margin-right:1em;}
[data-box="info"]>ul>li>div>ul>li>div>div:last-child{margin-right:0;}
[data-box="info"]>ul>li>div>ul>li>div>div>button,
[data-box="info"]>ul>li>div>ul>li>div>div>a{
    display:block; width:100%; height:100%; cursor:pointer; border:1px solid #C5C9D6; background-color:#fff;
    -webkit-border-radius:0.266em;
    border-radius:0.266em;
}
[data-box="info"]>ul>li>div>ul>li>div>div>button:before,
[data-box="info"]>ul>li>div>ul>li>div>div>a:before{content:""; display:block; position:relative; width:100%; height:100%; background-repeat:no-repeat; background-position:center center; background-size:contain;}
[data-box="info"]>ul>li>div>ul>li>div>div.h>button:before,
[data-box="info"]>ul>li>div>ul>li>div>div.h>a:before{background-image:url(../../../images/site/enter/content/info_list_simbol_1.svg);}
[data-box="info"]>ul>li>div>ul>li>div>div.d>button:before,
[data-box="info"]>ul>li>div>ul>li>div>div.d>a:before{background-image:url(../../../images/site/enter/content/info_list_simbol_2.svg);}
[data-box="info"]>ul>li>div>ul>li>div>div.m>button:before,
[data-box="info"]>ul>li>div>ul>li>div>div.m>a:before{background-image:url(../../../images/site/enter/content/info_list_simbol_3.svg);}
[data-box="info"]>ul>li>div>ul>li>div>div>button>span,
[data-box="info"]>ul>li>div>ul>li>div>div>a>span{opacity:0; position:absolute;}
[data-box="info"]>ul>li>div>ul>li>div>div>.v{
    display:none; position:absolute; right:-0.5em; top:3em; z-index:100; width:15.73em; background-color:#fff;
    -webkit-border-radius:0.2em;
    border-radius:0.2em;
    -webkit-box-shadow:0px 2px 8px rgba(0, 0, 0, 0.15);
    box-shadow:0px 2px 8px rgba(0, 0, 0, 0.15);
}
[data-box="info"]>ul>li>div>ul>li>div>div>.v:before{
    content:""; display:block; position:absolute; right:1em; top:-0.5em; z-index:0; width:1em; height:1em; background-color:#fff;
    box-shadow:0px 2px 8px rgba(0, 0, 0, 0.15);
    -webkit-transform:rotate(45deg);
    transform:rotate(45deg);
}
[data-box="info"]>ul>li>div>ul>li>div>div>.v:after{
    content:""; display:block; position:absolute; right:0; top:0; z-index:10; width:100%; height:100%; background-color:#fff;
    -webkit-border-radius:0.2em;
    border-radius:0.2em;
}
[data-box="info"]>ul>li>div>ul>li>div>div>.v>.head,
[data-box="info"]>ul>li>div>ul>li>div>div>.v>.midd{position:relative; z-index:50;}
[data-box="info"]>ul>li>div>ul>li>div>div>.v>.head{padding:0.33em 1em; font-weight:500; font-size:1em; border-bottom:1px solid #F0F0F0; color:#333;}
[data-box="info"]>ul>li>div>ul>li>div>div>.v>.midd{padding:0.8em 1em;}
[data-box="info"]>ul>li>div>ul>li>div>div>.v>.midd>a{display:block; line-height:1.6; font-size:0.933em; color:#555;}
[data-box="info"]>ul>li>div>ul>li>div>div>.v>.midd>a[href="#"]{opacity:0.3; cursor:default;}
[data-box="info"]>ul>li>div>ul>li>div>div>.v>.midd>a:not([href="#"]):hover{text-decoration:underline; color:#5078E7;}

[data-box="info"]>ul>li>div>ul>li>div.child{position:relative; right:auto; top:auto; z-index:0; width:100%; padding:1.5em 1.875em 1.5em 0; margin-top:0.533em; background-color:#F3F5FE;}
[data-box="info"]>ul>li>div>ul>li>div.child:after{content:""; display:block; clear:both;}
[data-box="info"]>ul>li>div>ul>li>div.child>strong,
[data-box="info"]>ul>li>div>ul>li>div.child>ul{float:left;}
[data-box="info"]>ul>li>div>ul>li>div.child>strong{width:8em; text-align:center; color:#2B4381;}
[data-box="info"]>ul>li>div>ul>li>div.child>ul{width:calc(100% - 1px - 8em);}
[data-box="info"]>ul>li>div>ul>li>div.child>ul:after{content:""; display:block; clear:both;}
[data-box="info"]>ul>li>div>ul>li>div.child>ul>li{
    float:left; line-height:1.2; padding:0.6em 1em 0.5em; margin:1px 0.57em 1px 0; font-size:0.875em; border:1px solid #C5C9D6; background-color:#fff;
    -webkit-border-radius:2em;
    border-radius:2em;
}
[data-box="info"]>ul>li>div>ul>li>div.child>ul>li:last-child{margin-right:0;}


[data-box="info"]>ul>li>div>ul>li>div>div[data-open="on"]>.v{display:block;}
[data-box="info"]>ul>li>div>ul>li>div>div[data-open="on"]>button,
[data-box="info"]>ul>li>div>ul>li>div>div[data-open="on"]>a,
[data-box="info"]>ul>li>div>ul>li>div>div>button:not([data-readonly="on"]):hover,
[data-box="info"]>ul>li>div>ul>li>div>div>a:not([data-readonly="on"]):hover{border-color:#000;}
[data-box="info"]>ul>li>div>ul>li>div>div>button[data-readonly="on"],
[data-box="info"]>ul>li>div>ul>li>div>div>a[data-readonly="on"]{opacity:0.4; cursor:default;}

@media screen and (max-width: 500px) {
    [data-box="info"]>ul>li{padding-left:0;}
    [data-box="info"]>ul>li>strong{position:relative; left:auto; top:auto;}
}
@media screen and (max-width: 450px) {
    [data-box="info"]>ul>li>div>ul>li>div.child{padding:1em 1.5em;}
    [data-box="info"]>ul>li>div>ul>li>div.child>strong,
    [data-box="info"]>ul>li>div>ul>li>div.child>ul{float:none; width:100%;}
}
@media screen and (max-width: 360px) {
    [data-box="info"]>ul>li>div>ul>li{font-size:0.9em;}
}