#ifrm {
    width: 100%;
   min-height: 300px;
    overflow: hidden;
    border: 0;
}


/* pc */
@media screen and (min-width:1300px){
   #memofile { max-width:1250px; }
}
/* tablet */
@media screen and (min-width:768px) and (max-width:1024px){
   #memofile { width:99%; }
}
/* mobile */
@media screen and (min-width:0) and (max-width:767px){
   #memofile { width:99%; }
}

body,div,p,h1,h2,h3,h4,h5,h6,ol,li,dl,dt,dd,ul,pre,form,fieldset,legend,button,table,th,td {
border:0;
margin:0;
padding:0;
}

ul,ol,li,dl {
list-style:none;
}

img {
border:0;
vertical-align:top;
font-size:0;
}

address,caption,cite,code,dfn,em,var {
font-style:normal;
}

a {
text-decoration:none;
color:#333;
}

a:hover,a:active,a:focus {
text-decoration:none;
}

table {
border:0;
border-spacing:0;
border-collapse:collapse;
padding:0;
}

strong {
font-weight:500;
}

h1,h2,h3,h4,h5,h6 {
font-weight:400;
}

article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,main {
display:block;
}

body,th,td,input,select,textarea,button {
color:#333;
font-size:18px;
line-height:1.5;
font-family: 'SUIT';
font-weight:400;
}

body, html{
width:100%;
height: 100%;
max-width:1080px;
margin:0 auto;
overflow-x:hidden;
overflow-y:scroll;
}

:focus {
outline:none;
}

.blind,.gnb-open-btn,.gnb-close-btn,.mobile-gnb {
display:none;
}

* {
-ms-touch-action: manipulation;
touch-action: manipulation;
}

body {
background-color: #202635;
overscroll-behavior-y:unset;
}
body::-webkit-scrollbar {
  display: none;
  /* Chrome, Safari, Opera*/
}



.area{
width:100%;
max-width:1080px;
margin:0 auto;
position:relative;
}
@keyframes upAndDown {
0% {bottom: 0px;}
50%{bottom: 10px;}
100%{bottom: 0px;}
}
.asq-btn{
position:absolute;
z-index: 999999;
right:0;
bottom:0;
width:50px;
height:50px;
display:flex;
align-items: center;
justify-content: center;
border-radius:999px;
background:#0084ff;
box-shadow: 1px 1px 10px rgba(0,0,0,0.3);
animation: upAndDown 2s infinite forwards;
cursor:pointer;
}
.asq-colose-box{
position:absolute;
z-index: 999999;
right:0;
bottom:0;
width:50px;
height:50px;
display:flex;
align-items: center;
justify-content: center;
border-radius:999px;
background:#0084ff;
box-shadow: 1px 1px 10px rgba(0,0,0,0.3);
cursor:pointer;
overflow:hidden;
display:none;
}
.asq-close{
width:70px;
height:70px;
background:#0084ff;
      -webkit-transform: rotate(0deg);
          transform: rotate(0deg);
    -webkit-transition: opacity 0ms ease 500ms, -webkit-transform 500ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: opacity 0ms ease 500ms, -webkit-transform 500ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: transform 500ms cubic-bezier(0.55, 0.055, 0.675, 0.19), opacity 0ms ease 500ms;
    transition: transform 500ms cubic-bezier(0.55, 0.055, 0.675, 0.19), opacity 0ms ease 500ms, -webkit-transform 500ms cubic-bezier(0.55, 0.055, 0.675, 0.19);

}


.asq-close span {
  position: absolute;
  display: inline-block;
  top: 50%;
  left: 50%;
  width: 18px;
  height: 4px;
  background-color: #fff;
}

.asq-close span:nth-of-type(1) {
  -webkit-transform: translate(-50%, -50%) rotate(45deg);
          transform: translate(-50%, -50%) rotate(45deg);
}

.asq-close span:nth-of-type(2) {
  -webkit-transform: translate(-50%, -50%) rotate(-45deg);
          transform: translate(-50%, -50%) rotate(-45deg);
}

.asq-close:hover {

-webkit-transform: rotate(-180deg);
    transform: rotate(-180deg);
  -webkit-transition: -webkit-transform 330ms cubic-bezier(0.215, 0.61, 0.355, 1) 150ms;
  transition: -webkit-transform 330ms cubic-bezier(0.215, 0.61, 0.355, 1) 150ms;
  transition: transform 330ms cubic-bezier(0.215, 0.61, 0.355, 1) 150ms;
  transition: transform 330ms cubic-bezier(0.215, 0.61, 0.355, 1) 150ms, -webkit-transform 330ms cubic-bezier(0.215, 0.61, 0.355, 1) 150ms;
  opacity: 1;
}

.aside-quick{
position:fixed;
right:20px;
bottom:200px;
z-index:9999;
width:100%;
flex-direction: column;
}

.asq-list{
/*position:absolute;
bottom:70px;*/
display:flex;
flex-direction: column;
right:0;
gap:10px;
height:0;
transition: all 0.2s linear;
transform: translateY(10px);
}
.asq-list a{
display:flex;
justify-content: flex-end;
align-items: center;
gap:10px;
font-size:14px;
color:#fff;
/*text-shadow: 1px 1px 2px rgba(0,0,0,0.9);*/
}
.asq-list a span{
background:#0084ff;
border-radius:999px;
padding:5px 10px;
}
.asq-list a i{
width:50px;
height:50px;
display:flex;
justify-content: center;
align-items: center;
background:#0084ff;
border-radius:999px;
box-shadow: 1px 1px 10px rgba(0,0,0,0.5);
color:#fff;
font-size:26px;
text-shadow: 1px 1px 2px rgba(0,0,0,0);
}
.close-btn{
position:absolute;
right:20px;
top:20px;
z-index:99999;
width:60px;
height:60px;
display:flex;
align-items: center;
justify-content: center;
color:#222;
font-size:25px;
animation: rgy2 0.2s;
animation-iteration-count: 1;
}

.open-btn{
display:flex;
align-items: center;
justify-content: center;
font-size:28px;
color:#fff;
width:34px;
height:34px;
position:absolute;
right:20px;
top:50%;
margin-top:-17px;
}

#sidebar{
position:fixed;
top:0;
bottom:0; 
z-index:999999999; 
-webkit-transition: bottom 1s;  
transition: bottom 1s; 
width:100%; 
max-width:1080px;
overflow:visible; 
margin-left:0;
left:auto;
border:0;
display:none;
}

@keyframes rgy2{
0% {
    transform: translateY(600px);
    opacity:0;
}

100% {
    transform: translateY(0px);
    opacity:1;
}


}

@keyframes rgy3{
0% {
transform: translateY(0px);
opacity:1;
}
    
100% {
transform: translateY(600px);
opacity:0;
}
    
}

.menu-box.on .side-lang{
display:flex;
justify-content: center;
gap:15px;
margin-top:50px;
animation: rgy 1s;
animation-iteration-count: 1;
animation-delay: 0.8s;
opacity:0;
animation-fill-mode: forwards;
}

.side-lang a{
text-transform: uppercase;
font-size:0.95em;
color:#666;
font-weight:600;
display:flex;
align-items: center;
gap:15px;
}
.side-lang a:before{
display:block;
content:"";
width:1px;
height:12px;
background:#ccc;
}
.side-lang a:first-child:before{
display:none;
}


.menu-box{
position:relative;
z-index:55; 
width:100%; 
left:auto; 
right:0; 
overflow-x:hidden; 
overflow-y:auto; 
height:100vh;
background:#fff;
display:block;
text-align:left;
box-sizing:border-box;
padding:20px;
-ms-overflow-style: none;
animation: rgy3 0.2s;
animation-iteration-count: 1;
animation-fill-mode: forwards;
}

.menu-box.on{
animation: rgy2 0.2s;
animation-iteration-count: 1;
animation-fill-mode: forwards;
}
.menu-box::-webkit-scrollbar{
  display:none;
}
.menu{
display:flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap:30px;
padding-top:100px;

}


.menu > li{
display:block;
width:100%;
box-sizing:border-box;
border-left:0;
box-sizing:border-box;
margin-bottom:10px;
padding-bottom:10px;
text-align:center;
}

.menu > li > ul > li{
padding:5px 0;
transition: all 0.5s;
}

.menu > li > ul{

}
.menu > li > ul.show li:first-child{
padding-top:25px;
transition: all 0.5s;
}

.menu > li > a{
height:30px;
line-height:30px;
font-weight:800;
display:block;
width:100%;
letter-spacing: 0.025em;
font-size:28px;
}

.menu > li > ul > li > a{
display:block;
letter-spacing: 0.025em;
}


.menu > li {
  overflow: hidden;
}

.menu > li > a {


}

@keyframes rgy{
    0% {
        transform: translateY(50px);
opacity:0;
    }
    
    100% {
        transform: translateY(0px);
        opacity:1;
    }
    

}


.menu.on > li > a {
animation: rgy 1s;
animation-iteration-count: 1;
animation-delay: 0.3s;
opacity:0;
animation-fill-mode: forwards;
text-transform: uppercase;
}


.tnb{
display:flex;
justify-content: center;
align-content: center;
background:#202635;
padding:7px 0;
gap:25px;
position:fixed;
z-index:99999;
width:100%;
max-width:1080px;
}
.tnb a{
color:rgba(255,255,255,0.8);
display:flex;
align-items: center;
gap:5px;
font-size:14px;
}
.tnb a img{
width:22px;
border-radius:2px;
}

.header{
background:#36549a;
position:fixed;
display:flex;
align-items: center;
z-index:99999;
width:100%;
max-width:1080px;
top:35px;
}
.header img{
width:160px;
}
.header a{
margin-left:20px;
}

.swiper-container {
height:100vh;
padding-top:95px !important;
padding-bottom:90px;
}

.swiper-slide img{width:100%;}


.sws-img{
position:relative;
width:100%;
padding-top:92.5%;
overflow:hidden;
}
.sws-img > div{
position:absolute;
width:100%;
height:100%;
display:flex;
justify-content: center;
align-items: center;
top:0;
left:0;
}
.sws-img img{
width:100%;
}
.box{
height:300px;
}


.banner-box {
position:fixed;
display: flex;
flex-direction: column;
align-items: flex-end;
top: 100vh;
z-index: 1200;
transition: top 1s ease-in-out;
transition-delay: 0.5s;
height: 100vh;
background-color: transparent;
overflow:hidden;
width:100%;
max-width:1080px;

}


.banner-box-area{
transform: translate(0%, 95px);
scroll-snap-type: y mandatory;
}
.banner{
scroll-snap-align: start;
 transform: translateZ(-2px);
}
.banner-box.transition-up {
top: 0px;
position:fixed;
transform: translate(0%, 0%);
overflow-style:marquee;
-ms-overflow-style:marquee,panner;
overflow:scroll;
transition: top 1s ease-in-out;
}


.banner-box.transition-up::-webkit-scrollbar{
 display:none;
}*

.swiper{
position:unset !important;
}
.swiper-slide {
/* Center slide text vertically */
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: flex-stary;
align-items: flex-start;
}

.banner a{
display:block;
width:100%;
}
.banner img{
width:100%;
}

.swiper-pagination{
top:0;
display:flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding-top:96px;
}
.swiper-pagination-vertical.swiper-pagination-bullets, .swiper-vertical>.swiper-pagination-bullets{
padding-bottom:0px;
top:0px !important;
transform: translate3d(0px, 0, 0) !important;
}

footer{
background:#202635;
display:flex;
padding:25px 0;
justify-content: center;
align-items: center;
flex-direction: column;
color:#fff;
font-size:15px;
text-align:center;
gap:15px;
width:100%;
max-width:1080px;
margin:0 auto;
position:fixed;
bottom:0;
}
.foot-tit{
font-size:1.25em;
font-weight:700;
opacity:0.6;
}
.foot-info{
display:flex;
justify-content: center;
flex-wrap:wrap;
gap:10px;
}



.tv{
width:100%;
box-sizing:border-box;
padding:80px 20px;
text-align:center;
background:#f1f1f1;
color:#111;
}
.tv-tit1{
font-size:58px;
font-weight:300;
}
.tv-tit1 strong{
font-weight:800;
}
.tv-tit2{
color:#8b8b8b;
font-weight:300;
font-size:22px;
}

.tv-tit3{
color:#8b8b8b;
font-weight:300;
margin-top:30px;
}
.tv-more{
text-align:right;
font-weight:600;
display:block;

margin-bottom:10px;
}
.banner .tv-more a{
display:inline-block;
width:auto;
font-size:0.85em;
}
.tv-arrow{
margin:20px 0;
}
.tv-arrow img{
width:50px;
}

.tv-list{
display:flex;
gap:4%;
}
.tv-list li{
width:48%;
}
.tv-list a{
display:block;
width:100%;
box-sizing:border-box;
background:#fff;
padding:10px;
}
.tvl-img{
position:relative;
width:100%;
padding-top:65%;
overflow:hidden;
}
.tvl-img > div{
position:absolute;
width:100%;
height:100%;
left:0;
top:0;
display:flex;
justify-content: center;
align-items: center;
}
.tvl-img > div img{
max-width:100%;
transition: .5s ease;
}
.tv-list a:hover .tvl-img > div img{
 -webkit-transform: scale(1.2); transform: scale(1.2);
}
.tvl-txt{
text-align:left;
box-sizing: border-box;
background-image:url(img/sym.jpg);
background-size:33px;
background-position:0 5px;
padding:10px 0;
padding-left:45px;
background-repeat: no-repeat;
}
.tvl-t1{
height:3em;
line-height:1.5em;
overflow:hidden;
}
.tvl-t2{
font-size:0.85em;
color:#888;
margin-top:10px;
}

@media (max-width:1024px){
.menu {
gap:30px;
padding-top:50px;
}
.menu > li{
margin-bottom:0;
padding-bottom:0;
}
.menu.on > li > a{
font-size:18px;
}
.menu > li > ul.show li:first-child{
padding-top:5px;
}

footer{
gap:5px;
font-size:13px;
}
.foot-info{
gap:0px 8px;
max-width:480px;
margin:0 auto;

}

.open-btn{
font-size:22px;
}


}

@media (max-width:640px){
.tv{
padding:30px 15px;
}
.tv-tit1{
font-size:28px;
}
.tv-tit2{
font-size:15px;
}
.tv-tit3{
font-size:13px;
margin-top:10px;
}
.tv-arrow{
margin:10px 0 5px;
}
.tv-arrow img{
width:28px;
}
.banner .tv-more a{
font-size:0.65em;
}
.tvl-txt{
background-size:25px;
padding-left:30px;
background-position:0 10px;
}
.tvl-t1{
font-size:15px;
}
.tvl-t2{
font-size:14px;
margin-top:5px;
}

.aside-quick{
bottom:240px;
right:10px;
}
.asq-list a{
gap:5px;
font-size:12px;
}
.asq-list a i{
width:28px;
height:28px;
font-size:17px;
}

}