@charset "utf-8";
/* CSS Document */

.page{ letter-spacing: -0.05em;}
.page>img{ width: 100%;}
.page ul{ margin-left: 20px;}
.page>*{ animation: pageani ease-in-out 0.5s; animation-fill-mode:forwards; opacity: 0; }
.page>*:nth-child(2){ animation-delay: 0.3s }
.page>*:nth-child(3){ animation-delay: 0.5s }
.page>*:nth-child(4){ animation-delay: 0.7s }
.page>*:nth-child(5){ animation-delay: 0.9s }
.page>*:nth-child(6){ animation-delay: 1.1s }
.page>*:nth-child(7){ animation-delay: 1.3s }
.page>*:nth-child(8){ animation-delay: 1.5s }
.page>*:nth-child(9){ animation-delay: 1.7s }
@keyframes pageani{ 0%{opacity:0; transform: translateY(20px); } 100% {  opacity:1; transform: translateY(0px); } }

.page>h1.tt1 {font-family: "Noto Sans KR"; font-weight: 300; line-height:130%; color:#7DAE21; }
h1.tt1>span{ color:#0E7864; font-weight: 400; }

#pgw0101 img{ display: block; width: 100%; }

#history{ width: 100%; }
#history td:first-child{ font-family: "Lusitana"; text-align: center; font-size: 200%; padding: 0px 30px;  }
#history td:last-child{ padding: 15px; }
#history td{ border-bottom:1px dotted #ddd; }
#history thead{ background: #393939; line-height: 35px; color:#969696 }

#pgw0104>h1 { padding:20px 0px;font-family: 'Noto Sans KR'; font-weight: 500; font-size: 130%; text-align: center; color:#333; border-bottom: 1px dotted #ccc; }

#pgw0201 .limg{ margin: 15px 0px; color:#000; }
#pgw0201 .limg>span.material-icons{ color:#E3D700; font-size: 250%;}
#pgw0201 .rdiv>h2{ font-family: "Noto Sans KR"; font-size: 120%; font-weight:400; padding-bottom: 15px; color:#000; }
#pgw0201>div:last-of-type{ border-bottom: 1px solid rgba(0,0,0,0.15); }
#pgw0201>ul{ margin-top: 30px;}

#pgw0202>div:nth-of-type(2){ border-top: 1px dotted #ccc; padding-top: 20px;}
#pgw0202>.flexrbox>div:nth-of-type(1)>h1{ background-color: #64B20C;}
#pgw0202>.flexrbox>div:nth-of-type(2)>h1{ background-color: #1D9C42;}
#pgw0202>.flexrbox>div:nth-of-type(3)>h1{ background-color: #284D4A;}

#pgw0203>div:nth-of-type(2){ border-top: 1px dotted #ccc; padding-top: 20px;}
#pgw0203 .grayrbox{ margin-bottom: 10px; display: flex; justify-content: space-between; }
#pgw0203 .grayrbox>p:last-child{ font-family: "Lusitana"; font-size: 200%; color: #F26522; display: flex; align-items: center; justify-content: right; width: 150px; }
#pgw0203 .grayrbox>p:last-child>span{ font-size:initial; display: inline-block; padding-left: 10px; }
#pgw0203 .grayrbox>div>h1{ font-family: "Noto Sans KR"; font-size: 120%; font-weight: 500; color:#000; margin-bottom: 10px; }

#pgw0204 ul>li>span { color:#00A599; }
#pgw0204 .odrbox>p{ flex: 0 0 auto; }
#pgw0204>div:nth-child(4)>div{ padding: 10px; border:1px solid #ddd; border-radius: 3px; }
#mserv{ width: 100%; text-align: center; border-bottom: 1px solid #eee; box-sizing: border-box; }
#mserv th{ font-family: "Noto Sans KR"; font-size: 110%; font-weight: 400; padding: 2px 1px; border-bottom: 1px solid #eee; }
#mserv th>div{color:#fff; background:#555; border-radius: 3px; padding: 5px 0px; }
#mserv th:nth-child(2)>div{ background: #64B20C; }
#mserv th:nth-child(3)>div{ background: #259574; }
#mserv th:nth-child(4)>div{ background: #0D736C; }
#mserv th:nth-child(5)>div{ background: #5693B9; }
#mserv th:nth-child(6)>div{ background: #5674B9; }
#mserv td{ padding: 10px 0px; }
#mserv td:first-child{ background:#f7f7f7; }
#mserv td:not(:last-child){ border-right: 1px solid #eee; }
#mserv tr:not(:last-child)>td{ border-bottom: 1px dotted #eee; }
#mserv tr:last-child>td>span{ font-family: "Lusitana"; font-size: 120%; color:#000; }
#mserv+ul{ margin-top:10px; margin-bottom: 10px; }

#pgw0501 .odrbox>p{ padding: 10px 10px;}
#pgw0501 .odrbox>img{ width: 20px; }
#pgw0501 .icoh1step{ padding: 20px 0px; }
#pgw0501 .icoh1step:not(:last-of-type){ border-bottom: 1px dotted rgba(0, 0, 0, 0.1);}
#pgw0501 .icoh1step>span{ color:rgba(255, 255, 255, 1)}

/*PC 관련*/
@media screen and (min-width: 501px) {
    .page{ margin:0px auto 40px auto; }
    .page>h1.tt1 {font-size: 170%; }

    #pgw0101 img{ margin:40px auto; }
    #pgw0103>h1{ margin-bottom: 40px;}
    #map{ width: 100%; height: 502px; box-sizing: border-box; }

    #pgw0201>h1{ margin-bottom: 40px;}
    #pgw0202>.flexrbox>div{ width: calc(33%);}

    #pgw0501 .odrbox{ border-bottom-left-radius: 90px; border-top-right-radius: 90px;	}
}
/*모바일 이하 관련*/
@media screen and (max-width: 500px) {
    .page{ margin:0px auto 20px auto; }
    .page>h1.tt1 {font-size: 150%; }

    #pgw0101 img{ margin:20px auto; }
    #history{ border-top: 2px solid #393939;}
    #history td{ display: block; }
    #history td:first-child{ padding:20px 0px 10px 0px; }
    #history td:last-child{ border-bottom: 1px solid #ccc;}
    #history tr:last-child>td:last-child{ border-bottom: none;}
    #pgw0103>h1{ margin-bottom: 20px;}
    #map{ width: 100%; height:382px; overflow: hidden; display: block; }

    #pgw0201>h1{ margin-bottom: 20px;}
    #pgw0202>.flexrbox>div{ width: 100%; margin-bottom: 10px;}

    #pgw0203 .grayrbox{ flex-wrap: wrap;}
    #pgw0203 .grayrbox>p:last-child{ width: 100%; margin-top: 15px; }

    #mserv{ font-size: 62%; line-height: 120%;}

    #pgw0501 .icoh1step>span:first-child{ font-size: 17px; width: 32px; height: 32px; margin-right: 10px; }
    #pgw0501 .icoh1step>h1{margin: 3px auto 10px auto; }
}