/*스와이퍼 기본*/
.swiper-slide {display: flex; justify-content: center; align-items: center;}
.swiper-slide img { display: block; width: 100%; height: 100%; object-fit: cover;}


button, input, select, *{font-family: 'Pretendard';font-size: 18px; }
.gra_bg{background: linear-gradient(45deg, #226FB8, #191f25);}
.gra_text{background: linear-gradient(to left bottom, #226FB8, #226FB8);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;}

.but_stlye01{background: linear-gradient(45deg, #226FB8, #226FB8);color: #fff;}
.radius_half{border-radius: 100px;}

.section_top{padding-top: 100px;}
.section_bot{padding-bottom: 200px;}
.section_tb{padding-top:100px;padding-bottom: 200px;}


.bold{font-weight: 600;}


:lang(en) b,
:lang(de) b,
:lang(cn) b,
:lang(jp) b,
:lang(en) em,
:lang(de) em,
:lang(cn) em,
:lang(jp) em,
:lang(en) h5,
:lang(de) h5,
:lang(cn) h5,
:lang(jp) h5,
:lang(en) p,
:lang(de) p,
:lang(cn) p,
:lang(jp) p{word-break:break-all !important;}

/*텍스트 컷*/
.text_cut{word-break: initial !important;white-space: normal; display: -webkit-box !important; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;}
.text_cut02{word-break: initial !important;white-space: normal; display: -webkit-box !important; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;}
.text_cut03{word-break: initial !important;white-space: normal; display: -webkit-box !important; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;}
.text_cut05{word-break: initial !important;white-space: normal; display: -webkit-box !important; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden;}
.text_cut07{word-break: initial !important;white-space: normal; display: -webkit-box !important; -webkit-line-clamp: 7; -webkit-box-orient: vertical; overflow: hidden;}


/*페이지네이션*/
.page_but i.fa{color:#666}
.page_but { margin-top: 80px;}

.page_but ul { width: 100%; display: flex; align-items: center; justify-content: center;color: #666}

.page_but ul li.arrow { color: #000; width: 20px;filter: invert(100%);width: 12px;height: 12px;opacity: 0.3;position: relative;}
.page_but ul li.arrow img{width: 100%;    height: 100%;display: flex;}
.page_but ul li.next_arr{transform: rotate(180deg);} 

.page_but ul a{margin: 0 10px; color: #888; font-size: 16px;}
.page_but ul li {  margin: 0 15px; color: #888; font-size: 16px;cursor: pointer;display: none;}



.page_but ul a.active,
.page_but ul li.active { color: #226FB8;text-align: center;font-weight: bold;display: block;}







header .head_left{display: flex;align-items: center;}
header {position: fixed;left:0;top:0;width: 100%;z-index: 999;    background: #fff;;}
header article{display: flex;  align-items: center;  justify-content: space-between;position: relative;padding:0;}
header article .logo{padding-left: 10px;width: 160px;;}
/*네비*/
header .nav{margin-left: 20px;;}
header .nav .nav_depth01{display: flex;align-items: center;}
header .nav .nav_depth01::before{content:'';display: block;width: calc(100% + 202px);height: 0%;background: #fff;position: absolute;left:50%;transform: translateX(-50%);top:-20px;z-index: -1;transition-duration: 0.2s;box-shadow: 0 0 10px rgba(0,0,0,0.05);}

header .nav .nav_depth01 > li{position: relative;    padding: 0 30px;    text-align: center;}

header .nav .nav_depth01 > li.open_pro{padding:0}
header .nav .nav_depth01 > li+li::before{content: '';display: block;width: 1px;height: 0%;background: #ddd;;position: absolute;left:0;top:-36px;opacity: 0;transition-duration: 0.2s;}
header .nav .nav_depth01 > li > em,
header .nav .nav_depth01 > li > a{color: #666;font-size: 20px;transition-duration: 0.4s;padding-bottom: 50px;font-weight: 600;cursor: pointer;}


header .nav .nav_depth01 > li > em{display: flex;align-items: center;padding-bottom: 0;padding:6px 20px;border-radius: 30px;transition-duration: 0s;}
header .nav .nav_depth01 > li > em img{opacity: 0.6;}
header .nav .nav_depth01 > li > em:hover{background: #226FB8;color:#fff;;}
header .nav .nav_depth01 > li > em:hover img{filter: invert(100%);opacity: 1;}
header .nav .nav_depth01 > li > em img{width: 18px;height: 18px;margin-left: 10px;;;}
header .nav .nav_depth02{position: absolute;text-align: center;left:50%;transform: translateX(-50%);top:40px;display: none;background: #226FB8;padding:20px;width: calc(100% + 70px);}
  header .nav .nav_depth02 ul{display: flex;flex-direction: column;align-items: center;}
header .nav .nav_depth02 li{font-size: 18px;color: #fff;opacity: 0.6;}
header .nav .nav_depth02 a{display: block;width: max-content;margin:0 auto;}
header .nav .nav_depth02 li +li{margin-top: 10px;}

:lang(de) header .nav .nav_depth02 a{width: 100% ;    font-size: 16px;}


/*메뉴 호버이벤트*/
header .nav .nav_depth01 > li:hover > a{font-weight: 600;opacity: 1;}
header .nav .nav_depth01 > li:hover  .nav_depth02{display: block;}
header .nav .nav_depth02 li:hover{font-weight: 500;opacity: 1;}




:lang(cn) .h_r_bot button{width: 120px;}
header .h_r_bot{margin-right: 20px;display: flex;justify-content: flex-end;;}
header .h_r_bot button{background: #226FB8;color: #fff;border-radius: 30px;padding:8px 12px;width: 100px;;font-size: 16px;}
header .h_r_bot button + button{margin-left: 10px;;}
header .h_r_bot button:last-child{background: #eee;color: #666;}

header .h_right{ display: flex;align-items: center;}
header .h_right > button{height: 50px;padding-left: 30px;padding-right: 30px;;}
header .lang{position: relative;}
header .mo_lang p{display: none;}
header .lang ul{display: flex;align-items: center;font-size: 15px;}
header .lang ul li{color: #888;font-weight: 400;cursor: pointer;display: flex;align-items: center;}
header .lang i{width: 25px;height: 25px;border-radius: 25px;overflow: hidden;margin-right: 4px;border:1px solid #eee;display: block;}
header .lang ul li + li{margin-left: 10px;;}
header .lang i img{width: 100%;height: 100%;}
header .lang ul li.on{color: #226FB8;font-weight: 500;}

header .sns_but{display: flex;}
header .h_r_top{display: flex;align-items: center;    justify-content: flex-end;}
header .mo_menu .h_r_top{ justify-content: flex-start;}
header .follow{display: flex;}
header .follow p{margin-right: 10px;font-weight: 600;font-size: 14px;color: #666;}
header .follow.lang li i{border:none;}

header .lang + .lang{margin-left: 20px;;position: relative;}
header .lang +.lang::before{content: '';display: block;width: 1px;height: 16px;background: #ddd;position: absolute;left:-10px;top:50%;transform: translate(0,-50%);}




:lang(en) header .follow,
:lang(de) header .follow { justify-content: flex-end; }
:lang(en) header .lang +.lang::before,
:lang(de) header .lang +.lang::before{display: none;}

:lang(en) header .nav .nav_depth01 > li > em,
:lang(en) header .nav .nav_depth01 > li > a,
:lang(de) header .nav .nav_depth01 > li > em,
:lang(de) header .nav .nav_depth01 > li > a {font-size: 17px;}

:lang(en) header .nav .nav_depth01 > li,
:lang(de) header .nav .nav_depth01 > li { padding: 0 14px;}
:lang(de) header .sns_but ,
:lang(en) header .sns_but { flex-direction:column-reverse;}
:lang(en) header .h_r_bot,
:lang(de) header .h_r_bot {justify-content: flex-end; margin-right:0; margin-top: 6px;}
:lang(en) header .h_r_bot button,
:lang(de) header .h_r_bot button{width:auto; padding-left: 20px;padding-right: 20px;}


:lang(en) .sitemap .map_nav .nav_depth01 em,
:lang(de) .sitemap .map_nav .nav_depth01 em {  font-size: 23px;    word-break: break-all;}
:lang(en) .sitemap .map_nav .nav_depth01,
:lang(de) .sitemap .map_nav .nav_depth01 {padding: 0 120px;}
:lang(en) .sitemap .map_nav .nav_depth02 li,
:lang(de) .sitemap .map_nav .nav_depth02 li{width: 100%; font-size: 18px;}
:lang(en) .sitemap .map_nav .nav_depth01 > li,
:lang(de) .sitemap .map_nav .nav_depth01 > li { padding: 180px 20px;}

:lang(jp) header .h_r_bot button { width: 130px;}



/*사이트맵*/

.sitemap{margin-left: 40px;width: 100px;height: 100px;display: flex;justify-content: center;align-items: center;background: #226FB8;}
.sitemap .but {width: 29px;height: 22px;display: flex;flex-direction: column;justify-content: space-between;transition-duration: 0.3s;z-index: 999;position: relative; cursor: pointer;;}
.sitemap .but span{width:100%;height: 2px;background: #fff ;display: block;transition-duration: 0.3s;}
.sitemap .but:hover span:nth-child(2){width: 70%;;}
.sitemap .but span:nth-child(2){margin-left: auto;}

.sitemap .but.on span{background: #666;}
.sitemap .but.on span:nth-child(1){transform:rotate(45deg) translate(7px, 7px);}
.sitemap .but.on span:nth-child(2){width: 0;;}
.sitemap .but.on span:nth-child(3){transform: rotate(-45deg) translate(7px, -7px);}

.sitemap .map_nav{position: absolute;left:0;top:0;width: 100vw;height: 100vh;background: #fff;display: none;}

.sitemap .map_nav .pc_nav_depth{display: flex;padding:0 200px;height: 100vh;}
.sitemap .map_nav .pc_nav_depth > li{width: calc(100% / 5);position: relative;padding:180px 40px}
.sitemap .map_nav .pc_nav_depth > li + li::before{content:'';display: block;width: 1px;height: 100%;background: #eee;position: absolute;left:0;top:50%;transform: translateY(-50%);}
.sitemap .map_nav .pc_nav_depth em{font-size: 25px;color: #226FB8;font-weight: 600; cursor: pointer;
    background: linear-gradient(to left bottom, #226FB8, #226FB8);-webkit-background-clip: text; -webkit-text-fill-color: transparent;}
.sitemap .map_nav .nav_depth02{margin-top: 40px;}
.sitemap .map_nav .nav_depth02 li{margin-top: 30px;color: #888;font-size: 20px;position: relative;width: max-content;font-weight: 600; cursor: pointer;}
.sitemap .map_nav .nav_depth02 li::before{content:'';display: block;width: 0%;height: 2px;background: #226FB8;position: absolute;bottom:-8px;left:-5%;transition-duration: 0.3s;}

.sitemap .map_nav .pc_nav_depth > li:hover{background: #f8f8f8;}
.sitemap .map_nav .nav_depth02 li:hover {color: #226FB8;}
.sitemap .map_nav .nav_depth02 li:hover::before {width: 110%;}


/*서브헤더*/
.sub_header .sub_bg{width: 100%;background: transparent !important;display: block;position: relative;

    animation-name: sub_bg;
    animation-duration:6s;
    animation-direction:alternate;
    animation-fill-mode: forwards;
  }
  
  /* 키프레임 이름 = 애니메이션 이름 */
  @-webkit-keyframes sub_bg {
    0% {
      background-size: 110%;
    }
    100% {
        background-size: 105%;
    }
  }


  .sub_header .sub_tabs{display: flex;max-width: 1400px;margin:0 auto;margin-top: 15px;;}
  .sub_header .sub_tabs ul{display: flex;color: #666;flex-wrap: wrap;}
  .sub_header .sub_tabs ul li:first-child,
  .sub_header .sub_tabs ul li+li{margin-right: 16px;;}
  .sub_header .sub_tabs ul li{font-size: 16px;margin:8px 0;}
  .sub_header .sub_tabs ul li.on a{color: #fff;font-weight: 600;background: #226FB8;}
  .sub_header .sub_tabs ul li a{display: block;width: 100%;background: #f5f5f5;padding:8px 30px;border-radius: 40px;}
  .sub_header {position: relative;}
.sub_header .sub_bg .txtbox{color: #111;max-width: 1400px;width: 100%;margin:0px auto;}
.sub_header .sub_bg ul li{display: none;}
.sub_header .sub_bg ul li.on{display: block;font-size: 40px;font-weight: bolder;}
.sub_header .sub_bg ul li.on span{font-size: 22px; color: #888;font-weight: 400;margin-left: 10px;}


.sub_header .sub_bg .subh_tit{font-size: 25px;text-align: center;}
.sub_header .right_con{display: flex;align-items: center; width: calc(100% - 35px);}
.sub_header .con{margin-top: 140px;}
.sub_header .con > div{position: relative; display: flex;    align-items: center;}
  .sub_header .right_con > span{transform:rotate(-90deg) translateX(3px);margin:0 20px;opacity: 0.4;}
  .sub_header .right_con > span img{width: 70%;}
.sub_header .home{width: 35px;height: 35px;display: flex; align-items: center;justify-content: center; background: #226FB8;border-radius: 40px;cursor: pointer;}
.sub_header .home img{filter: invert(100%);width: 40%;}

.sub_header .sab_menu{position: relative;font-size: 16px;}
.sub_header .sab_menu + .sab_menu{margin-right: 20px;}
.sub_header .sab_menu p{height: 70px;display: flex;align-items: center;font-weight: 600;color: #888;}
.sub_header .sab_menu p::before{content:'';display: block;width: 0%;background: #226FB8;position: absolute;left:0;top:0;height: 100%;z-index: -1;transition-duration: 0.3s;}
.sub_header .sab_menu p.on span{transform: rotate(180deg);}
.sub_header .sab_menu p span{position: absolute;right:20px;transition-duration: 0.3s;}
.sub_header .sab_menu ul li a{display: block;}
:lang().sub_header .sab_menu ul li a{word-break: break-all;}

/* .sub_header .sab_menu ul li+li{margin-top: 10px;} */
.sub_header .sab_menu ul li{display: none;} 
.sub_header .sab_menu ul li.on{display: block;font-weight: 600;font-size: 16px;color: #888;} 

footer{background: #111;color: #fff;font-size: 14px;padding:60px 0;}
footer .f_top{display: flex;align-items: center;justify-content: space-between;}
footer .right{display: flex;align-items: center;}
footer .right a{display: block;}
footer .left a{padding:14px 30px;border:1px solid #fff;}
footer .left a + a,
footer .right a + a{margin-left: 10px;}
footer .left{display: flex;}
footer .left a {opacity: 0.6;    display: block; width: fit-content;}
footer .f_bot{margin-top: 40px;display: flex;}
footer .f_bot > div{width: 50%;;}
footer .f_bot > div > p{margin:10px 0;}
footer .f_bot > div > div{display: flex;}
footer .f_bot > div > div p + p{margin-left: 20px;}
footer .f_bot > div > div p span{margin-right: 10px;opacity: 0.6;}
footer .f_bot > div > div p strong{font-weight: 500;}
footer .f_bot em{padding-left: 10px;position: relative;font-weight: bold;}
footer .f_bot em::before{content:'';display: block;width: 3px;height: 3px;border-radius: 20px;position: absolute;left:0;top:50%;transform: translate(0, -50%);background: #fff;}
footer .copy_txt{margin-top: 20px;opacity: 0.5;;}


:lang(de) header .nav .pc_nav_depth > li {
  padding: 0 15px;
}

.sitemap .map_nav .mo_nav_depth{padding:0 !important; padding-top:110px !important;display: none;}
.sitemap .map_nav .mo_nav_depth .nav_depth02{display: none;padding:0 20px; color: #333; margin-top: 0; margin-bottom: 20px;}
.sitemap .map_nav .mo_nav_depth .nav_depth02 li{color: inherit;font-weight: 500; margin-top: 0;}
.sitemap .map_nav .mo_nav_depth .nav_depth02 li + li{ margin-top: 8px;}

.sitemap .map_nav .mo_nav_depth em{padding:15px 20px;display: block; color: #226FB8;font-size: 20px;}
.sitemap .map_nav .mo_nav_depth > li{padding: 0 !important}
.sitemap .map_nav .mo_nav_depth > li +li{border-top:1px solid #ddd;}

.sitemap .map_nav .mo_nav_depth .mo_menu{position: absolute;left:20px;top:20px;}


header .sitemap .lang ul li i{width: 30px;height: 30px;}

/* ********************************************* *
 * 1800px
 * ********************************************* */
 @media screen and (max-width: 1800px){
header .nav .pc_nav_depth > li > em, 
header .nav .pc_nav_depth > li > a { padding: 0 20px; font-size: 18px;}


:lang(de) header .nav{display:none ;}

.sitemap .map_nav .pc_nav_depth {padding: 0 0px;}
:lang(en).sitemap .map_nav .pc_nav_depth,
:lang(de).sitemap .map_nav .pc_nav_depth {padding: 0 0px;}



}
/* ********************************************* *
 * 1600px
 * ********************************************* */
 @media screen and (max-width: 1660px){
  header .nav .pc_nav_depth > li:hover > a,
  header .nav .pc_nav_depth > li > em, 
  header .nav .pc_nav_depth > li > a {padding: 6px 10px; font-size: 18px;}
  header article .logo {padding-left: 0;width: 160px;}
  header .nav {margin-left: 20px;}
  header .h_search {width: 200px;}
  .sub_header .sub_tabs,
  .sub_header .sub_bg{padding-left: 20px;;}



  .sitemap .map_nav .pc_nav_depth > li { padding: 180px 20px;}

  header .sns_but { align-content: flex-end;flex-direction: column-reverse; }
  header .h_r_bot {margin-right: 0px;margin-top: 8px;}
  header .h_r_bot button { padding: 6px 20px;}
  .sitemap {margin-left: 20px;}


  :lang(de) header article {padding: 0px 0;}

  :lang(en) header .nav .nav_depth01,
  :lang(de) header .nav .nav_depth01{display: none;}

  :lang(en) .sitemap .map_nav .nav_depth02 li, 
  :lang(de) .sitemap .map_nav .nav_depth02 li {  font-size: 16px;}


  .product.type02 {  overflow-y: scroll; height: auto; padding-bottom: 20px;}
  .product.type02 .panels li{width: 50%;}

 }
 
 /* ********************************************* *
 * 1400px
 * ********************************************* */
 @media screen and (max-width: 1400px){
  header .h_search {  margin-right: 20px;}
  .sitemap {margin-left: 20px;}
  header .nav {  margin-left: 0px;}


  header .mo_lang{position: relative;}
  header .mo_lang p{display: block;width: 100px;border:1px solid #eee;padding:4px 10px;display: flex;align-items: center;font-size: 16px;color: #666;}
  header .mo_lang p i{margin-right: 4px;display: block;border:none}
  header .mo_lang p span{position: absolute;right:10px;top:50%;transform: translate(0,-50%);width: 8px;}
  header .mo_lang p.on span{transform: translate(0,-50%) rotate(180deg);}
  header .mo_lang p span img{width: 100%;}
  header .mo_lang ul{position: absolute;left:0;top:35px;display: block;width: 100%;background: #fff;border:1px solid #eee;padding:10px;;display:none ;}

  header .mo_lang:last-child ul li + li{margin-left: 0;margin-top: 4px;;}

  header .mo_lang ul li.on{display:none;}
  /* header .sns_but {flex-direction: row;} */
  /* header .h_r_bot {margin-right: 8px; margin-top: 0;} */

  header .lang +.lang::before{display: none;}
  header .lang + .lang {margin-left: 10px;}

  header article .logo {width: 140px;}
  header .nav .pc_nav_depth > li:hover > a, 
  header .nav .pc_nav_depth > li > em, 
  header .nav .pc_nav_depth > li > a {padding: 6px 10px;}
  header .nav .nav_depth02 li {font-size: 16px;}
  header .nav .nav_depth02 li +li {margin-top: 8px;}

  header .follow p{display: none;}



 }
 
 /* ********************************************* *
 * 1200px
 * ********************************************* */
 @media screen and (max-width: 1200px){
 
  .sitemap .map_nav .pc_nav_depth em {font-size: 22px;}
  .sitemap .map_nav .nav_depth02 li { font-size: 18px;    margin-top: 20px;}
  .sitemap .map_nav .nav_depth02 li::before{display: none;}

  header .nav {display: none;}

:lang(en) header .nav{display: none;}

  
.sitemap{width: 100px;height: 100px;}
.pro_view .type02.data_signal .li_5 li:last-child:before{display: none;}

:lang(en) .sitemap .map_nav .pc_nav_depth em,
:lang(de) .sitemap .map_nav .pc_nav_depth em{height: 54px;display: flex; align-items: center;font-size: 20px;}


:lang(en) .info em,
:lang(de) .info em {  font-size: 30px;}


 }
 
 /* ********************************************* *
 * 1024px
 * ********************************************* */
 @media screen and (max-width: 1024px){
 



   
 }
 
 
 /* ********************************************* *
 * 960px
 * ********************************************* */
 @media screen and (max-width: 960px){
 
 
.section_top{padding-top: 160px;}
.section_bot{padding-bottom: 160px;}
.section_tb{padding-top: 160px;padding-bottom: 160px;}
/*  
.sitemap .map_nav .pc_nav_depth{    flex-direction: column;  justify-content: center;padding-top: 100px;position: relative;}
.sitemap .map_nav .pc_nav_depth > li{display: flex;width: 100%;padding:0;align-items: center;}
.sitemap .map_nav .pc_nav_depth > li em{width: 130px;}
.sitemap .map_nav .pc_nav_depth > li + li{margin-top: 30px;}
.sitemap .map_nav .pc_nav_depth > li::before{display: none;}
.sitemap .map_nav .nav_depth02{display: flex;margin-top: 0;width: calc(100% - 130px);flex-wrap: wrap;} 
.sitemap .map_nav .nav_depth02 li{margin-top: 0;margin-top:4px;margin-bottom: 4px;;}

:lang(en).sitemap .map_nav .pc_nav_depth > li em{width: 200px;}
:lang(en).sitemap .map_nav .nav_depth02{width: calc(100% - 200px);} 
.sitemap .map_nav .pc_nav_depth > li:hover{background: transparent;}
.sitemap .map_nav .nav_depth02 li:first-child,
.sitemap .map_nav .nav_depth02 li + li{margin-right: 20px;;}

.sitemap .map_nav .pc_nav_depth > li.mo_menu{margin-top: 100px;position: absolute;
  width: calc(100% - 32px); bottom: 20px;}
.sitemap .map_nav .pc_nav_depth > li:last-child::after{display: none;} */

footer .f_bot{display: block;    margin-top: 30px;}
footer .f_bot > div{width: 100%;}
footer .f_bot > div + div{margin-top: 20px;;}
footer .copy_txt{text-align: right;}
footer {padding: 40px 0;}



:lang(en) footer .left a {  padding:0px; border: none;}
:lang(en) footer .left a:first-child,
:lang(en) footer .left a + a, 
:lang(en) footer .right a + a {  margin-left: 0px;margin-right: 12px;;}


/* 
:lang(de) .sitemap .map_nav .pc_nav_depth > li{padding: 0; }
:lang(de) .sitemap .map_nav .nav_depth02{margin-top: 0; margin-left: 20px;}
:lang(de) .sitemap .map_nav .nav_depth02 > li{ width: auto; margin-top: 0; margin:4px 0; margin-right: 20px;} */

:lang(de) header .h_r_bot{justify-content: flex-start;}

:lang(de) footer .f_top{display: block;}
:lang(de) footer .f_top .left{margin-top: 20px;}

:lang(de) footer .left a {padding: 0; border:none;}


.sitemap .map_nav{overflow-y: scroll;    height:60vh;background: rgba(255,255,255,0.9); color: #fff; box-shadow: 0 0 10px rgba(0,0,0,0.05); height: auto; max-height: 600px;;}


.sitemap .map_nav .pc_nav_depth{display: none;}
.sitemap .map_nav .mo_nav_depth{display: block;}


header .sitemap .h_r_bot {justify-content: flex-start ;}
header .sitemap .sns_but { flex-direction: column-reverse;}
header .sitemap .h_r_bot {  margin-right: 0px; margin-top: 8px;}


:lang(en) .info em,
:lang(de) .info em {  font-size: 26px;}






 }
 
 
 /* ********************************************* *
 * 768px
 * ********************************************* */
 @media screen and (min-width: 769px){
  
 
  
 }
 @media screen and (max-width: 768px){
 
  .sub_header .sub_bg .txtbox { margin: 0;}
  .sub_header .con >div > span { margin: 0 14px;}
  .sub_header .home {width: 30px;height: 30px;}
  .sub_header .sab_menu p {height: 50px;}
  .sub_header .sub_bg ul li.on {font-size: 40px;}
  .sub_header .sub_bg ul li.on span{display: block;margin-left: 0;font-size: 16px;}
  .sub_header .sub_tabs { margin-top: 10px;}
  .sub_header .sub_tabs ul li {  font-size: 15px;margin-top: 5px;margin-bottom: 5px;;}
  .sub_header .sub_tabs ul li a{padding: 6px 26px;}
  .sub_header .sub_tabs ul{flex-wrap: wrap;}
  .sub_header .sub_tabs ul li:first-child,
  .sub_header .sub_tabs ul li+li{margin-left: 0;margin-right: 10px;;}


  header article .logo {width: 120px;}
  .sitemap {width: 60px;  height: 60px;}


  header .h_r_bot button{font-size: 14px;width:90px; padding: 6px 10px;}
  header .sns_but { display: flex;    flex-direction: row;}
  header .h_r_bot { margin-right: 8px;margin-top: 0px;}

  :lang(en) .h_right > .sns_but, 
  :lang(de) .h_right > .sns_but {display: flex; display: none;}

  

:lang(en) .info em,
:lang(de) .info em { width: auto;}

:lang(en) .info em:last-child:before,
:lang(de) .info em:last-child:before{display: none;}




 }
 
 
 /* ********************************************* *
 * 640px
 * ********************************************* */
 @media screen and (max-width: 640px){
 
.section_top{padding-top: 100px;}
.section_bot{padding-bottom: 100px;}
.section_tb{padding-top: 100px;padding-bottom: 100px;}

/* .sitemap .map_nav .pc_nav_depth > li{display: block;}
.sitemap .map_nav .nav_depth02{width: 100%;display: block;}
.sitemap .map_nav .pc_nav_depth > li + li {margin-top: 20px;}
.sitemap .map_nav .pc_nav_depth em {  font-size: 18px;}
.sitemap .map_nav .nav_depth02 li {  font-size: 16px;} */

header .h_right >.sns_but{display: none;}

footer .left {display: block;margin-top: 14px;;flex-wrap: wrap;}
footer .left a {padding: 0;display: block; border:none;}
footer .left a + a{margin-top: 10px; margin-left: 0;}
footer .right a + a {  margin-left: 6px;}
footer .f_bot > div > div p span {margin-right: 4px;}


footer .f_top h1{width: 100px;}
footer .f_top h1 img{width: 100%;}

footer .f_top{display: block;}
footer .f_bot > div > p{word-break: keep-all;}


.sub_header .sub_tabs, .sub_header .sub_bg {  padding-left: 16px;}
.sitemap .map_nav .pc_nav_depth {padding-top: 60px;justify-content: flex-start;}



/* :lang(en).sitemap .map_nav .pc_nav_depth > li em{width: 100%;}
:lang(en).sitemap .map_nav .nav_depth02{width: calc(100%);}  */


/* .sitemap .map_nav .pc_nav_depth > li em{width: 100%; display: block;padding: 20px 20px; border-bottom:1px solid #ddd;}
.sitemap .map_nav .nav_depth02{padding: 10px 20px;display: none;}
.sitemap .map_nav .pc_nav_depth{padding:50px 0;}
.sitemap .map_nav .pc_nav_depth > li + li{margin-top: 0;} */


.sub_header .con >div {  margin-top: 80px;}
.section_tb {padding-top: 80px; padding-bottom: 80px;}

/* 
:lang(de) .sitemap .map_nav .pc_nav_depth{padding:60px 0;}
:lang(de) .sitemap .map_nav .nav_depth02 { margin-left: 0;} */

.sitemap { width: 60px;  height: 60px;}


 }
 
 
 /* ********************************************* *
 * 500px
 * ********************************************* */
 @media screen and (max-width: 500px){
  .sub_header .sub_tabs ul li{margin-top: 5px; margin-bottom: 5px;  }
  .sub_header .sub_tabs ul li a{padding: 4px 16px;}
  .sub_header .sub_bg ul li.on {font-size: 32px;}
   
  .sub_header .con >div { margin-top: 100px;}



  .sub_header .sub_tabs ul li {font-size: 14px;}
  .sub_header .sub_tabs ul li a {padding: 4px 12px;}
  /* header .sns_but{    flex-direction: column;    justify-content: flex-end;} */
  /* header .h_r_top{margin-top: 10px;} */
  /* header .h_r_bot{margin-right: 0;width: 100%;} */


  .section_top{padding-top: 60px;}
  .section_bot{padding-bottom: 60px;}
  .section_tb{padding-top: 60px;padding-bottom: 60px;}

  footer .f_bot > div > div p + p { margin-left: 10px;}
  footer .f_bot > div > p {margin: 4px 0;}
  footer .copy_txt {  margin-top: 30px;}

  footer .f_bot > div > div {flex-wrap: wrap;}
  footer .f_bot > div > div p:first-child,
  footer .f_bot > div > div p + p {margin-left: 0;padding-right: 10px;}

  .sub_header .home {width: 25px; height: 25px;}
  .sub_header .sab_menu ul li.on,
  .sub_header .sab_menu { font-size: 14px;}
  .sub_header .con >div > span {margin: 0 10px;}


  :lang(en) .sub_header .sub_bg ul li.on {font-size: 26px;}

  .sub_header .right_con > span {width: 10px;    margin: 0 6px;    position: relative;
    top: 2px;}
  .sub_header .right_con > span img {width: 80%;}


  .sub_header .con {margin-top: 80px;}
  :lang(en) .sitemap .map_nav .nav_depth01 em, 
  :lang(de) .sitemap .map_nav .nav_depth01 em {
    font-size: 18px;}

    
header .sitemap .lang ul li i{width: 25px;height: 25px;}
header .h_r_bot button{font-size: 12px;}
:lang(en) header .h_r_bot button, :lang(de) header .h_r_bot button { padding-left: 12px;  padding-right: 12px;}
.sitemap .map_nav .mo_nav_depth {padding-top: 140px !important;}
.sitemap .map_nav .mo_nav_depth .mo_menu {top: 50px;}



 }
 
 /* ********************************************* *
 * 450px
 * ********************************************* */
 @media screen and (max-width: 450px){
  footer .left a{padding:0; border:none;}
  footer .left a + a{margin-left: 15px;}


 }
 
 /* ********************************************* *
 * 400px
 * ********************************************* */
 @media screen and (max-width: 400px){
    .section_top{padding-top: 60px;}
    .section_bot{padding-bottom: 60px;}
    .section_tb{padding-top: 60px;padding-bottom: 60px;}
 


    .sitemap {width: 55px;height: 55px;  }
    .sitemap .but {width: 20px; height: 15px;}
    header article .logo { width: 100px;  padding-left: 4px;  }


    /* .sitemap .map_nav .nav_depth02 li {font-size: 14px; margin-top: 2px;    margin-bottom: 2px; }
    .sitemap .map_nav .pc_nav_depth > li + li {margin-top: 8px;}
    .sitemap .map_nav .nav_depth02 li:first-child, 
    .sitemap .map_nav .nav_depth02 li + li {   margin-right: 10px;  } */


    .sitemap .but.on span:nth-child(1) {transform: rotate(45deg) translate(5px, 4px); }
    .sitemap .but.on span:nth-child(3) {transform: rotate(-45deg) translate(5px, -4px); }

    footer .left a{border:none;padding:0;opacity: 0.8;}
    footer .left a + a{margin-left: 12px;  }

    .sub_header .con >div > span {margin: 0px 5px; }

    footer .f_top h1 {width: 80px;}
    footer {  font-size: 12px;}



    .sub_header .home {width: 22px; height: 22px; }
    .sub_header .sab_menu ul li.on, .sub_header .sab_menu {font-size: 12px;}
    .sub_header .con >div > span {margin: 0px 3px; }
    .sub_header .sub_tabs ul li:first-child, .sub_header .sub_tabs ul li+li { margin-right: 5px; }

    .sub_header .con >div {margin-top: 70px;}

    :lang(de) header .follow{justify-content: flex-start;  margin-bottom: 10px; }
    header .mo_menu .h_r_top{display: block;}
    header .lang + .lang{margin-left: 0;}

    
    
    :lang(de) .sub_header .span02,
    :lang(de) .sub_header .menu02{display: none;}
 }