.nav_header{display:flex;background:#00251a;width:100%;height:2rem;align-items:center;color:#00251a;padding: 1.5em;padding-left: 0.2em; position:fixed;top:0px;left:0px;z-index: 10; }
.nav_header a{font-weight: 600;}
.nav_left{display:flex;align-items: center;color:#00251a;}
.nav_center{flex-grow:1;}
.nav_right{display: flex;}
.usa{padding-left: 5px;font-size: 1.1em; position:relative;padding-right: 8px;color:#00251a;}
.usa a{padding-left: 10px;font-size: 1em;position:relative; color:#00251a;-webkit-text-stroke:0.1vw #00251a;}
.usa a::before{
    content:attr(data-text);position: absolute;top:10;left:5;width:0;height:75%;color:#4fed51;-webkit-text-stroke:0vw #00251a;border-right:3px solid #4fed51;overflow:hidden;
    animation:usa_bar 2s linear infinite;-webkit-animation: usa_bar1 2s linear infinite;}
@keyframes usa_bar{0%{width:0;} 70%{width:100%;}}
@keyframes usa_bar1{0%{width:0;} 55%{width:100%;}}

.logo{width:60px;}
.uhak{font-size: 1.3em; }

.nav_menu{font-size: 0.8em;padding-right: 8px;}
.navbar_togglebtn {display: none;}

/*hamburger*/
.ham_btn{position:absolute; transition:.3s ease-in-out; width:30px; height:26px; cursor:pointer; display:block; top:0.75rem; right:1rem; z-index:100;}
.ham_btn span{position: absolute; width:100%; height:6px; border-radius:4px; background:#eee; top:0; transition:transform 0.2s ease-in-out, opacity 0.2s ease-in-out; }
.ham_btn span:nth-child(1){top:0; }
.ham_btn span:nth-child(2),.ham_btn span:nth-child(3){top:10px; }
.ham_btn span:nth-child(4){top:20px; } 

.ham_btn.active span{background: #fff;}
.ham_btn.active span:nth-child(1),.ham_btn.active span:nth-child(4){opacity:0; }
.ham_btn.active span:nth-child(2){transform: rotate(45deg); }
.ham_btn.active span:nth-child(3){transform: rotate(-45deg); }
/*hamburger_menu*/
.ham_overlay{position:fixed; background: #004c8c; top:0; right:0; width:20%; height:0; opacity:0; border-radius: 10px; display:flex; justify-content: center; align-items: center; text-align: center; transition:0.5s; z-index:2;}
.ham_menu li{margin: 1.3rem 0; opacity:0; }
.ham_menu li a{color:#fff; opacity:0.8; transition:opacity 0.3s ease; }
.ham_menu li a:hover{opacity:1; }

@keyframes fadeInLeft{
    0%{opacity:0; transform:translateX(-25%); }
    100%{opacity:1; transform:translateX(0); }}
.ham_overlay.visi{height:75%; opacity:.9; }
.ham_overlay.visi nav ol li{
    animation: fadeInLeft 0.5s ease forwards; }
.ham_overlay.visi nav ol li:nth-child(1){animation-delay:0.23s;}
.ham_overlay.visi nav ol li:nth-child(2){animation-delay:0.30s;}
.ham_overlay.visi nav ol li:nth-child(3){animation-delay:0.37s;}
.ham_overlay.visi nav ol li:nth-child(4){animation-delay:0.42s;}
.ham_overlay.visi nav ol li:nth-child(5){animation-delay:0.49s;}
.ham_overlay.visi nav ol li:nth-child(6){animation-delay:0.56s;}
/**/
.cushion_box{height:3rem;background: darkorange;}

/*carousel*/
.caro_container{background: rgb(0,151,167);
background: linear-gradient(0deg, rgba(0,151,167,1) 0%, rgba(0,104,135,1) 48%, rgba(1,88,131,1) 100%); padding: 3px;}
.carousel_wrap{margin: 0 auto; max-width: 700px; border:2px solid #ccc; padding: 6px; box-shadow: 0 0 20px 3px white; border-radius: 10px;}
/**/
/* Main_Body */
.section_wrapper{background: rgb(0,151,167);
background: linear-gradient(180deg, rgba(0,151,167,1) 0%, rgba(0,92,120,1) 19%, rgba(1,51,75,1) 59%, rgba(0,33,50,1) 100%); font-size: .9rem; color:white; }
.h1{padding: 30px 0 0;   display: flex; justify-content: center; --var-color:rgb(0,238,255); }
.theme1{display: none;}
.theme{background-color:#222; width:45%; border-radius: 3px; text-align: center;padding: 10px 0;margin: 0 auto; font-size: 0.7rem; font-family: "Times New Roman", Times, serif;  color: var(--var-color); position:relative; font-weight: bold;}
.theme::before{position:absolute; content: attr(data-text); text-shadow: 0 0 20px var(--var-color); filter:blur(10px) brightness(0); animation: flickering 2s linear infinite forwards; animation-delay: 1s;}
@keyframes flickering{
    0%,100% {filter:blur(3px) brightness(1);}
    3% {filter:blur(3px) brightness(0);}
    6% {filter:blur(3px) brightness(0);}
    7% {filter:blur(3px) brightness(1);}
    8% {filter:blur(3px) brightness(0);}
    9% {filter:blur(3px) brightness(1);}
    10% {filter:blur(3px) brightness(0);}
    20% {filter:blur(3px) brightness(1);}
    50% {filter:blur(3px) brightness(1);}
    99% {filter:blur(3px) brightness(1);}
    }

.outer_layout{padding: 25px 0; }
.inner_layout{max-width:1220px; margin: 0 auto; }
.chart{background-color: rgba(255,255,255,0.2); word-break: keep-all;}

.chart_item1{ margin-bottom: 100px; display:grid; grid-template-columns: 60% 6% 32%; grid-auto-rows:minmax(100px, auto); padding: 10px; grid-gap:10px; grid-template-areas: 'b a e' 'c a e' 'd a e'; border-radius: 15px;}
.m_item{display:flex; justify-content: center; align-items: center; font-size: 1.1rem; font-weight: bold;background-color: rgba(255,255,255,0.1); border-radius: 10px; box-shadow: inset 0 0 30px rgba(255,255,255,0.3); border-top: 2px solid white; }
.m_item1{grid-area:a; background-color: darkgreen; color:orange; text-shadow: 2px 8px 6px rgba(0,0,0,0.2), 0px -3px 40px rgba(255,255,255,0.4);}
.pc1{display:contents; font-size: 1.1rem; font-weight: bold;}
.mobile1{display:none; font-size: 1.1rem; font-weight: bold;}
.m_item2{grid-area:b; }
.m_item3{grid-area:c; }
.m_item4{grid-area:d; }
.m_item5{grid-area:e; }
.dis_block{padding: 3%; line-height: 1.4rem;}
.dis_block h2{font-size: 1.1rem; text-align: center;margin-bottom: 10px;padding: 10px 0; font-weight: bold;}
.dis_block p{font-size: 0.9rem; text-align:justify;text-indent:1rem;}
.sapwha1{width:50%}
@font-face {font-family: 'UhBeeyoongdi';src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_five@.2.0/UhBeeyoongdi.woff') format('woff');font-weight: normal;font-style: normal;}
.window{
  width: 100%;
  min-height: 100%;
  background: url('https://images.unsplash.com/photo-1515798630163-c9ff318b62e3?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxzZWFyY2h8MzV8fHJhaW4lMjBvbiUyMHRoZSUyMHdpbmRvd3xlbnwwfHwwfHw%3D&auto=format&fit=crop&w=500&q=60')no-repeat center center;
  background-size: cover;
  display: flex;
  justify-content: center;
  align-items: center; border-radius: 10px; z-index: 1}
.w_letter{
  width: 340px;
  height: 250px;
  display: flex;
  justify-content: center;
  align-items: center;
  -webkit-backdrop-filter: brightness(1.1) blur(20px);
  backdrop-filter: brightness(1.1) blur(8px);
  mix-blend-mode: overlay;
  border-radius: 34%;
  transform: rotateZ(-4deg);}
.w_letter p{
  font: normal 1.2rem 'UhBeeyoongdi';}


/**/
.chart_item2{ margin-bottom: 100px; display:grid; grid-template-columns: 23% 6% 69%; grid-auto-rows:minmax(100px, auto); padding: 10px; grid-gap:10px; grid-template-areas: 'j f g' 'j f h' 'j f i'; border-radius: 15px;}

.m_item6{grid-area:f; background-color: darkgreen; color:orange; text-shadow: 2px 8px 6px rgba(0,0,0,0.2), 0px -3px 40px rgba(255,255,255,0.4);}
.pc2{display:contents; font-size: 1.1rem; font-weight: bold;}
.mobile2{display:none; font-size: 1.1rem; font-weight: bold;}
.m_item7{grid-area:g; }
.m_item8{grid-area:h; background-color: rgba(0,100,200,0.4);}
.m_item9{grid-area:i; }
.m_item10{grid-area:j; }
.sapwha2{width:70%}

.consultant{margin-top: 15px; }
.showoff{font-size: 1.2rem; line-height: 1.2; font-family: arial; font-style:italic; font-weight: bold; margin-bottom: 25px; color:#ccc}
/*showoff의 폰싸만 변경하면 아래 em싸이즈 같이 연동되어 바뀜*/
.showoff_cover{display:inline-block; vertical-align: top; height:1.2em; overflow: hidden; margin-left: 0.1em; }
.showoff_list {animation: rolling 10s infinite ; color:#ffeb3b; font-weight: bold; }
.showoff_list li{font-weight: 600;text-shadow: 2px 8px 16px rgba(0,0,0,0.2), 0px -3px 20px rgba(255,255,255,0.4); font-style:;}
.showoff_title{display:inline-block; line-height: 1; color:#fce4ec; font-weight: bold;}
@keyframes rolling{
    0%{transform:translateY(0);}
    25%{transform:translateY(-20%);}
    50%{transform:translateY(-40%);}
    75%{transform:translateY(-60%);}
    100%{transform:translateY(-80%);}}

.showoff_icons{display: block; margin: 1.7em 0 0.5em; text-align: center; }
.showoff_icons a{; color:inherit; background-image: url(../img/sns_9060.png);width:30px;height:30px;display: inline-block;text-indent:-9999px;}
.showoff_icons a.twitter{background-position: left top; }
.showoff_icons a.facebook{background-position: center top;}
.showoff_icons a.pinterest{background-position: right top;}
.showoff_icons a:hover{background-position-y:bottom;}







/**/
.chart_item3{ margin-bottom: ; display:grid; grid-template-columns: 56% 6% 36%; grid-auto-rows:minmax(100px, auto); padding: 10px; grid-gap:10px; grid-template-areas: 'l k o' 'm k o' 'n k o'; border-radius: 15px;}

.m_item11{grid-area:k; background-color: darkgreen; color:orange; text-shadow: 2px 8px 6px rgba(0,0,0,0.2), 0px -3px 40px rgba(255,255,255,0.4);}
.pc3{display:contents; font-size: 1.1rem; font-weight: bold;}
.mobile3{display:none; font-size: 1.1rem; font-weight: bold;}
.m_item12{grid-area:l; }
.m_item13{grid-area:m; }
.m_item14{grid-area:n; }
.m_item15{grid-area:o; }
.sapwha3{background-image: url("../img/commencement.png"); background-size: cover; background-position: center;}

.dis_block h2{position:relative; text-shadow: 2px 4px 6px rgba(0,0,0,0.8), 0px -3px 40px rgba(255,255,255,0.4);}
.dis_block h2::before{content:''; position:absolute; top:; left:0 ;right:0; bottom:5px;  background-color: orange; height:3px; width:30%; margin: 0 auto; border-radius: 50%; box-shadow: 0px 2px 6px 0.5px black;}
/*.tag_word{}*/



/*footer*/
.profile_section{background:#003300; color:#ddd; padding:0px 10px }
.profile_section{line-height: 1.2rem; }
.sub_profile{max-width: 900px;margin: 0 auto;}
.cont{display:flex; justify-content: space-between; width:100%; font-weight: bold; border-top: 3px solid; color:orangered;margin: 0 0 20px 0; padding: .5em 1rem;;background-color: #333; box-shadow: 2px 2px 30px 5px white;}
.con1{;}
.con2{text-shadow:0 0 100px; animation:book 1.5s infinite linear;}
@keyframes book{
    0%,100%{color:lawngreen;}
    25%{color:deeppink;}
    50%{color:deepskyblue;}
    75%{color:white;}}
.profile_section h1{}
.list dt{font-size: 0.7rem; color:orange;float:left;width:9em;}
.lisr dd{overflow: hidden;}
.list_phone{padding-left: 8em;}

#footer{font-size: 0.8rem; width:100%; height:200px; }
.footer{text-align:center; padding:30px 50px 30px; color:#daf; background:#002800;border-top: 1px solid #dbdbdb;line-height: 1.5;}
.footer li{position:relative; display:inline; padding:0 7px 0 10px; white-space: nowrap; }
.footer li::before{content:''; width:1px; height:12px; background-color: #dbdbdb; position:absolute; top:3px; left:0px;}
.footer li:nth-child(1)::before{width:0; }
.ff{color:#ddf;}
.footer address{padding-top: 15px; color:#ddf;}


/* Mobile 구조일 때 */
@media(max-width:768px){
.usa{position:relative;padding-right: 8px;color:#00251a;font-size: 0.9em;}
.logo{width:50px;}
.uhak{font-size: 1em;}
.nav_right{display:none;}
.navbar_togglebtn {display:block ;}
ol a{font-weight: bold;}

    
.outer_layout{padding: 5px 0; }
.h1{padding: 20px 0 0; }
.chart_item1{ margin-bottom: 100px; display:flex; flex-direction: column; border-radius: 15px;}
.pc1{display:none; font-size: 1.1rem; font-weight: bold;}
.mobile1{display:contents; font-size: 1.1rem; font-weight: bold;}
.m_item{margin-bottom: 20px;}
.m_item1{padding: 10px;}
.sapwha1{width:25%; padding: 10px 0;}

.chart_item2{ margin-bottom: 100px; display:flex; flex-direction: column; border-radius: 15px;}
.pc2{display:none; font-size: 1.1rem; font-weight: bold;}
.mobile2{display:contents; font-size: 1.1rem; font-weight: bold;}
.m_item6{padding: 10px;}
.sapwha2{width:20%; padding: 10px 0;}
.showoff{font-size: 1.5rem; line-height: 1.5; }
.blank{text-align:left;}
    
.chart_item3{ margin-bottom: ; display:flex; flex-direction: column; border-radius: 15px;}
.pc3{display:none; font-size: 1.1rem; font-weight: bold;}
.mobile3{display:contents; font-size: 1.1rem; font-weight: bold;}
.m_item11{padding: 10px;}
.sapwha3{width:100%; height:30vh; }

.profile_section{padding-top: 20px;}   

    }