/* Web Fonts */
@import url(https://cdn.rawgit.com/moonspam/NanumSquare/master/nanumsquare.css);
@import url('https://fonts.googleapis.com/css2?family=Nanum+Gothic+Coding:wght@400;700&family=Nanum+Gothic:wght@400;700;800&family=Nanum+Myeongjo:wght@400;700;800&display=swap');

/* Contents */
@media only screen and (min-width : 320px) and (max-width : 480px){
    .wrap { max-width:480px; width:100%; margin:auto; overflow:auto; }
    .area { margin:5px; overflow:auto; font-size:17px; line-height:1.6; color:#1A1A1A; font-family: 'NanumSquare', sans-serif;}
    .main_cont { font-size:14px; line-height:1.5;  color:#1A1A1A; font-family: 'NanumSquare', sans-serif;}
    .title_orange { font-size:30px; line-height:2; color:#f07d00f; font-weight:bold; margin:20px 0px 20px 0px; font-family: 'NanumSquare', sans-serif;}
    .title_green { font-size:20px; line-height:2; color:#3D4D42; font-weight:bold; margin:20px 0px 20px 0px; font-family: 'NanumSquare', sans-serif;}
    .title_sub { font-size:20px; line-height:2; color:#f07d00f; font-weight:bold; padding:5px; text-align:center; font-family: 'NanumSquare', sans-serif;}
    .sub_title {display:table;}
    .box_cont {padding:10px; max-width:100%; font-size:14px; text-align:justify; float:left; display:table-cell; vertical-align:middle;}
    .box_border {box-sizing: border-box; width:100%; min-width:350px; padding:20px; background-color:#ffffff; border-style:solid; border-color:#DAE9F2; border-width:1px; text-align:left; float:left; display:table-cell; vertical-align:middle;}
    .box_orange {box-sizing: border-box; width:100%; padding:5px; background-color:#F5F5F5; border-style:solid; border-color:#999999; text-align:justify; float:left; display:table-cell; vertical-align:middle;}
    .box_green {display:inline-block; width:170px; height:50px; margin:10px; line-height:50px; border-radius:5px; color:white; text-align:center; background-color:#3D4D42;}
    .box_rounded {margin:20px 5px 5px 5px; font-size:14px; padding: 15px; float:left; text-align:justify; border-radius:15px; border-width:3px; border-style:solid; border-color:#F5F5F5;}
    .box_rounded2 {display:inline-block; width:170px; height:50px; margin:10px; line-height:50px; border-style:solid; border-color:#959FA6; border-width:1px; border-radius:5px; text-align:center; background-color:#ffffff; color:#000 !important;}
    .box_rounded3 {padding: 15px; display:inline-block; text-align:justify;border-radius:10px; border-width:3px; border-style:solid; border-color:#F5F5F5;}
    .box_rounded4 {font-size:14px; padding: 15px; float:left; text-align:justify; border-radius:15px; border-width:3px; border-style:solid; border-color:#F5F5F5;}
    .box_bottom {display:inline-block; width:135px; height:30px; margin:5px 2.5px; font-size:17px; line-height:1.5; text-align:center; border-bottom-color:#3D4D42; border-bottom-style:solid; border-bottom-width:3px;}
    .box_bottom2 {display:inline-block; width:150px; height:30px; margin:5px 2.5px; font-size:17px; line-height:1.5; text-align:center; border-bottom-color:#3D4D42; border-bottom-style:solid; border-bottom-width:3px;}
    .sub_icon {text-align:left; display:table-cell; vertical-align:middle;}
    .rounded { border-radius: 15px;}
    .rounded_box{margin-top:0px; padding: 10px; float:left; text-align:justify;border-radius:10px; border-width:3px; border-style:solid; border-color:#F5F5F5;}
    .circle{float:left; margin:10px; width:135px; height:135px; line-height:135px; background-color: #999999; font-size:16px; text-align:center; color:#fff !important; border-radius: 50%;}
    img.rounded { border-radius: 15px; width:100%;}
    img.rectangle { width:100%;}
    hr.cont {width:100%; border-width:1px; border-style:dotted; border-color:#CCCCCC; margin:35px 0px;}

/* Table*/
    td.number {padding:5px; border-bottom: 1px dotted #CCCCCC; width:70px; font-size:13px; line-height:1.4; color:#999999;}
    td.number2 {padding:5px; border-bottom: 1px dotted #CCCCCC; width:100px; font-size:13px; line-height:1.4; color:#D98D0B;}
    td.bottom_line {padding:5px; font-size:13px; line-height:1.4; border-bottom: 1px dotted #CCCCCC; text-align:justify;}

/* Tab */
    #container { margin:5px; text-align:center; }
    .tab { list-style: none; margin: 1px 0 1px 0; padding: 0; overflow: hidden; }
    /* Float the list items side by side */
	.tab li { background-color:#f1f2f2; }
    /* Style the links inside the list items */
	.tab li a { display: inline-block; color: #000; text-align: center; text-decoration: none; padding: 14px 16px; font-size: 14px; color:#666666; transition:0.3s; }
    /* Style the tab content */
	.tabcontent { border-top: 0.01em solid #999999; margin-top: -2.2px; margin-right: 0px; display: none; background-color:rgb(255,255,255); padding: 6px 12px; color:#222; text-align:left !important; }
    ul.tab li.current{ border: 0.1em; border-style: solid !important; border-color: #999999 #999999 #999999 #999999 !important; background-color: rgb(255,255,255); color:#45973d !important; font-weight:bold; }
    .tabcontent.current { display: block; text-align:left !important; margin-right: 0px; }
            }
@media screen and (min-width: 480px){
    .wrap { max-width:1000px; width:100%; margin:auto; overflow:auto; }
    .area { margin:20px; overflow:auto; font-size:17px; line-height:1.6; color:#1A1A1A; font-family: 'NanumSquare', sans-serif;}
    .main_cont { font-size:17px; line-height:1.6;  color:#1A1A1A; font-family: 'NanumSquare', sans-serif;}
    .title_orange { font-size:30px; line-height:2; color:#f07d00f; font-weight:bold; margin:20px 0px 20px 0px; font-family: 'NanumSquare', sans-serif;}
    .title_green { font-size:30px; line-height:2; color:#3D4D42; font-weight:bold; margin:20px 0px 20px 0px; font-family: 'NanumSquare', sans-serif;}
    .title_sub { font-size:20px; line-height:2; color:#f07d00f; font-weight:bold; padding:5px; text-align:center; font-family: 'NanumSquare', sans-serif;}
    .sub_title {display:table;}
    .box_cont {padding:20px; max-width:100%; min-width:350px; text-align:left; float:left; display:table-cell; vertical-align:middle;}
    .box_border {box-sizing: border-box; width:100%; min-width:350px; padding:20px; background-color:#ffffff; border-style:solid; border-color:#DAE9F2; border-width:1px; text-align:left; float:left; display:table-cell; vertical-align:middle;}
    .box_rounded {margin:50px; padding: 30px; float:left; text-align:justify;border-radius:25px; border-width:3px; border-style:solid; border-color:#F5F5F5;}
    .box_orange {box-sizing: border-box; width:100%; min-width:350px; padding:20px; background-color:#F5F5F5; border-style:solid; border-color:#999999; text-align:left; float:left; display:table-cell; vertical-align:middle;}
    .box_green {display:inline-block; width:170px; height:50px; margin:10px; line-height:50px; border-radius:5px; color:white; text-align:center; background-color:#3D4D42;}
    .box_rounded2 {display:inline-block; width:170px; height:50px; margin:10px; line-height:50px; border-style:solid; border-color:#959FA6; border-width:1px; border-radius:5px; text-align:center; background-color:#ffffff;  color:#000 !important;}
    .box_rounded3 {padding: 30px; display:inline-block; text-align:justify;border-radius:25px; border-width:3px; border-style:solid; border-color:#F5F5F5;}
    .box_rounded4 {padding: 30px; float:left; text-align:justify; border-radius:25px; border-width:3px; border-style:solid; border-color:#F5F5F5;}
    .box_bottom {display:inline-block; width:135px; height:50px; margin:10px; line-height:50px; text-align:center; border-bottom-color:#3D4D42; border-bottom-style:solid; border-bottom-width:3px;}
    .box_bottom2 {display:inline-block; width:150px; height:50px; margin:10px; line-height:50px; text-align:center; border-bottom-color:#3D4D42; border-bottom-style:solid; border-bottom-width:3px;}
    .sub_icon {text-align:left; display:table-cell; vertical-align:middle;}
    .rounded { border-radius: 15px;}
    .rounded_box{width:100%; max-width:380px; margin-top:20px; padding: 30px; float:left; text-align:justify;border-radius:25px; border-width:3px; border-style:solid; border-color:#F5F5F5;}
    .circle{float:left; margin:10px; width:135px; height:135px; line-height:135px; background-color: #999999; font-size:16px; text-align:center; color:#fff !important; border-radius: 50%;}
    img.rounded { border-radius: 15px; width:100%;}
    img.rectangle { width:100%;}
    hr.cont {width:100%; border-width:1px; border-style:dotted; border-color:#CCCCCC; margin:35px 0px;}

/* Table*/
    td.number {padding:5px; border-bottom: 1px dotted #CCCCCC; width:120px; color:#999999;}
    td.number2 {padding:5px; border-bottom: 1px dotted #CCCCCC; width:150px; color:#D98D0B;}
    td.bottom_line {padding:5px; border-bottom: 1px dotted #CCCCCC; text-align:justify;}

/* Tab */
    #container { margin:20px; text-align:center; }
    .tab { list-style: none; margin: 0 0 1px 0; padding: 0; overflow: hidden; }
    /* Float the list items side by side */
	.tab li { float: left; background-color:#f1f2f2; }
    /* Style the links inside the list items */
	.tab li a { display: inline-block; color: #000; text-align: center; text-decoration: none; padding: 14px 16px; font-size: 14px; color:#666666; transition:0.3s; }
    /* Style the tab content */
	.tabcontent { border-top: 0.01em solid #999999; margin-top: -2.2px; margin-right: 25px; display: none; background-color:rgb(255,255,255); padding: 6px 12px; color:#222; text-align:left !important; }
    ul.tab li.current{ border: 0.1em; border-style: solid !important; border-color: #999999 #999999 white #999999 !important; background-color: rgb(255,255,255); color:#45973d !important; font-weight:bold; }
    .tabcontent.current { display: block; text-align:left !important; margin-right: 25px; }
            }


/* youtube resize */
.youtubeWrap {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%;
}
.youtubeWrap iframe {
  position: absolute;
  width: 100%;
  height: 100%;
}