header{ position:absolute; width:100%; display:flex; align-items:center; justify-content:space-between; background-color:rgba(21,30,62,1); position:fixed; box-shadow:0 0 3px rgba(21,30,62,1); top:0; left:0; }
header > h1{ margin:16px 15px; width:120px; height:70px; z-index:301; position:relative;}
header > nav{ position:fixed; left:0; top:-100vh;  display:flex; justify-content:center;align-items:center; width:100%; height:100vh; z-index:300; transition-duration:0.3s; background-color:rgba(21,30,62,1);  }
header > nav > ul{ display:flex; flex-direction: column;  justify-content:center;align-items:center; gap:24px;}

header > nav > ul > li{ position:relative; display:flex; flex-direction: column; justify-content:center;align-items:center;  }
header > nav > ul > li > a{  transition-duration:0.3s; position:relative;}
header > nav > ul > li > a > span{font-size:32px; font-weight:400; display:inline-block; text-shadow:0px 0px 5px #000; color:#fff; text-transform:uppercase;}
header > nav > ul > li > a:after{ content:""; z-index:2; position:absolute; left:0; bottom:-5px; width:0; height:2px; border-radius:3px; background-color:#ffffff; box-shadow:none; display:inline-block; transition-duration:0.15s;}
header > nav > ul > li > a.active > span{ color:#ffd400;}
header > nav > ul > li > a.active > span:after{ width:100%; background-color:#ffd400; box-shadow:0 0 5px #000;}

header > nav ul > li > a:hover > span{ color:#ffd400;}
header > nav > ul > li > a:hover:after{ width:100%; background-color:#ffd400; box-shadow:0 0 5px #000;}
header > nav > ul > li:last-child > a:after{ display:none;}

header > nav > ul > li > ul{ display:flex;  gap:60px;}
header > nav > ul > li:last-child{ margin-top:30px; padding:8px 30px;}
header > nav > ul > li:last-child > a > span{ font-size:0;}

header > nav > ul > li > ul.languageul > li > a{ position:relative;}
header > nav > ul > li > ul.languageul > li > a.active > span:after{ content:""; z-index:2; position:absolute; left:0; bottom:-5px; width:100%; height:2px; border-radius:3px; background-color:#fff; box-shadow:none; display:inline-block; transition-duration:0.15s;}
header > nav > ul > li > ul.languageul > li > a:hover > span:after{ content:""; z-index:2; position:absolute; left:0; bottom:-5px; width:100%; height:2px; border-radius:3px; background-color:#ffd400; box-shadow:none; display:inline-block; transition-duration:0.15s;}
header > nav > ul > li > ul.languageul > li > a:hover.active > span:after{ content:""; z-index:2; position:absolute; left:0; bottom:-5px; width:100%; height:2px; border-radius:3px; background-color:#ffd400; box-shadow:none; display:inline-block; transition-duration:0.15s;}


header > nav > ul > li > ul{ visibility:visible; opacity:1;}
header > nav > ul > li > ul > li > a{  display:inline-block;  transition-duration:0.3s; position:relative; }
header > nav > ul > li > ul > li > a > span{ font-size:24px; color:#fff; text-shadow:0px 0px 5px #000; position:relative;  text-transform:uppercase; font-weight:400; line-height:1.2;}

header > nav > ul > li > ul > li > a > span:after{ content:""; z-index:2; position:absolute; left:0; bottom:-5px; width:0; height:2px; border-radius:3px; background-color:#ffffff; box-shadow:none; display:inline-block; transition-duration:0.15s;}


header > nav > ul > li > a.languagebtn{ font-size:0; width:44px; height:44px; display:none; background-size:cover; 
background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20height%3D%2248%22%20viewBox%3D%220%200%2048%2048%22%20width%3D%2248%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M0%200h48v48h-48z%22%20fill%3D%22none%22%2F%3E%0A%3Cpath%20fill%3D%22%23ffffff%22%20d%3D%22M23.99%204c-11.05%200-19.99%208.95-19.99%2020s8.94%2020%2019.99%2020c11.05%200%2020.01-8.95%2020.01-20s-8.96-20-20.01-20zm13.85%2012h-5.9c-.65-2.5-1.56-4.9-2.76-7.12%203.68%201.26%206.74%203.81%208.66%207.12zm-13.84-7.93c1.67%202.4%202.97%205.07%203.82%207.93h-7.64c.85-2.86%202.15-5.53%203.82-7.93zm-15.48%2019.93c-.33-1.28-.52-2.62-.52-4s.19-2.72.52-4h6.75c-.16%201.31-.27%202.64-.27%204%200%201.36.11%202.69.28%204h-6.76zm1.63%204h5.9c.65%202.5%201.56%204.9%202.76%207.13-3.68-1.26-6.74-3.82-8.66-7.13zm5.9-16h-5.9c1.92-3.31%204.98-5.87%208.66-7.13-1.2%202.23-2.11%204.63-2.76%207.13zm7.95%2023.93c-1.66-2.4-2.96-5.07-3.82-7.93h7.64c-.86%202.86-2.16%205.53-3.82%207.93zm4.68-11.93h-9.36c-.19-1.31-.32-2.64-.32-4%200-1.36.13-2.69.32-4h9.36c.19%201.31.32%202.64.32%204%200%201.36-.13%202.69-.32%204zm.51%2011.12c1.2-2.23%202.11-4.62%202.76-7.12h5.9c-1.93%203.31-4.99%205.86-8.66%207.12zm3.53-11.12c.16-1.31.28-2.64.28-4%200-1.36-.11-2.69-.28-4h6.75c.33%201.28.53%202.62.53%204s-.19%202.72-.53%204h-6.75z%22%2F%3E%0A%3C%2Fsvg%3E");}
header > nav > ul > li > a.languagebtn.active{ background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20height%3D%2248%22%20viewBox%3D%220%200%2048%2048%22%20width%3D%2248%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M0%200h48v48h-48z%22%20fill%3D%22none%22%2F%3E%0A%3Cpath%20fill%3D%22%23ffd400%22%20d%3D%22M23.99%204c-11.05%200-19.99%208.95-19.99%2020s8.94%2020%2019.99%2020c11.05%200%2020.01-8.95%2020.01-20s-8.96-20-20.01-20zm13.85%2012h-5.9c-.65-2.5-1.56-4.9-2.76-7.12%203.68%201.26%206.74%203.81%208.66%207.12zm-13.84-7.93c1.67%202.4%202.97%205.07%203.82%207.93h-7.64c.85-2.86%202.15-5.53%203.82-7.93zm-15.48%2019.93c-.33-1.28-.52-2.62-.52-4s.19-2.72.52-4h6.75c-.16%201.31-.27%202.64-.27%204%200%201.36.11%202.69.28%204h-6.76zm1.63%204h5.9c.65%202.5%201.56%204.9%202.76%207.13-3.68-1.26-6.74-3.82-8.66-7.13zm5.9-16h-5.9c1.92-3.31%204.98-5.87%208.66-7.13-1.2%202.23-2.11%204.63-2.76%207.13zm7.95%2023.93c-1.66-2.4-2.96-5.07-3.82-7.93h7.64c-.86%202.86-2.16%205.53-3.82%207.93zm4.68-11.93h-9.36c-.19-1.31-.32-2.64-.32-4%200-1.36.13-2.69.32-4h9.36c.19%201.31.32%202.64.32%204%200%201.36-.13%202.69-.32%204zm.51%2011.12c1.2-2.23%202.11-4.62%202.76-7.12h5.9c-1.93%203.31-4.99%205.86-8.66%207.12zm3.53-11.12c.16-1.31.28-2.64.28-4%200-1.36-.11-2.69-.28-4h6.75c.33%201.28.53%202.62.53%204s-.19%202.72-.53%204h-6.75z%22%2F%3E%0A%3C%2Fsvg%3E");}


header.menuon > nav{ top:0; }


.logo_svg{ width:120px; height:70px;}
.logo_svg g > path{ fill:#FFF; }
.logo_svg g > polygon{ fill:#FFF; }
.logo_svg g > rect{ fill:#FFF; }
/*
.logo_svg g > path{ fill:transparent; animation-name:effects; animation-duration:20s; animation-iteration-count:infinite;}
.logo_svg g > polygon{ fill:transparent; animation-name:effects; animation-duration:20s; animation-iteration-count:infinite;}
.logo_svg g > rect{ fill:transparent; animation-name:effects; animation-duration:20s; animation-iteration-count:infinite;}
*/

.logo_h1_1{ animation-delay:0.1s;}
.logo_h1_2{ animation-delay:0.3s;}
.logo_h1_3{ animation-delay:0.5s;}
.logo_h1_4{ animation-delay:0.7s;}
.logo_h1_5{ animation-delay:0.9s;}
.logo_h1_6{ animation-delay:1.1s;}
.logo_h1_7{ animation-delay:1.3s;}
.logo_h1_8{ animation-delay:1.5s;}
.logo_h1_9{ animation-delay:1.7s;}
.logo_h2_1{ animation-delay:0.4s;}
.logo_h2_2{ animation-delay:0.5s;}
.logo_h2_3{ animation-delay:0.6s;}
.logo_h2_4{ animation-delay:0.7s;}
.logo_h2_5{ animation-delay:0.8s;}
.logo_h2_6{ animation-delay:0.9s;}
.logo_h2_7{ animation-delay:1s;}
.logo_h2_8{ animation-delay:1.1s;}
.logo_h2_9{ animation-delay:1.2s;}
.logo_h2_10{ animation-delay:1.3s;}
.logo_h2_11{ animation-delay:1.4s;}
.logo_h2_12{ animation-delay:1.5s;}
.logo_h2_13{ animation-delay:1.6s;}
.logo_h2_14{ animation-delay:1.7s;}
.logo_h2_15{ animation-delay:1.8s;}
.logo_h2_16{ animation-delay:1.9s;}
.logo_h2_17{ animation-delay:2s;}
.logo_h2_18{ animation-delay:2.1s;}
.logo_h2_19{ animation-delay:2.2s;}
.logo_h2_20{ animation-delay:2.3s;}
.logo_h2_21{ animation-delay:2.4s;}
.logo_h2_22{ animation-delay:2.5s;}
.logo_h2_23{ animation-delay:2.6s;}
.logo_h2_24{ animation-delay:2.7s;}

svg{stroke:transparent;}

@keyframes effects{
	0%{ fill:transparent;}
	5%{ fill:#fff;}
	85%{ fill:#fff;}
	90%{ fill:transparent;}
	100%{ fill:transparent;}
}

@keyframes effectshover{
	0%{ fill:transparent;}
	5%{ fill:#ffd400;}
	85%{ fill:#ffd400;}
	90%{ fill:transparent;}
	100%{ fill:transparent;}
}



.hambergermenubtn{ position:absolute; top:36px; right:36px; width:32px; height:32px; display:inline-block; z-index:301;}
.hambergermenubtn > span{ position:absolute; display:inline-block; transition: all 0.4s; left: 0; width: 100%; height: 8%; background-color: #ffffff; border-radius: 32px; float:left; overflow:hidden; }
.hambergermenubtn > span:nth-child(1){ top:6%;}
.hambergermenubtn > span:nth-child(2){ top:46%;}
.hambergermenubtn > span:nth-child(3){ top:90%;}
.hambergermenubtn.on1 > span:nth-child(1){ top:46%;}
.hambergermenubtn.on1 > span:nth-child(2){ top:46%;}
.hambergermenubtn.on1 > span:nth-child(3){ top:46%;}
.hambergermenubtn.on1.on2 > span:nth-child(1){ transform:rotate(45deg);}
.hambergermenubtn.on1.on2 > span:nth-child(2){ transform:rotate(45deg);}
.hambergermenubtn.on1.on2 > span:nth-child(3){ transform:rotate(-45deg);}



footer{ background-color:#ffffff; color:#000000; border-top:5px solid #12176A; width:100%; padding:50px 0; position:relative; z-index:299;}
footer > div > nav > ul{ display:flex; justify-content:flex-start; width:90%; gap:12px 30px; margin:auto; flex-wrap:wrap;}
footer > div > nav > ul > li{ position:relative;}
footer > div > nav > ul > li:after{ content:""; height:12px; display:inline-block; position:absolute; width:1px; background-color:#bbb; right:-15px; top:8px;}
footer > div > nav > ul > li:last-child:after{ display:none;}
footer > div > nav > ul > li > a{ display:inline-block;  font-size:20px; font-weight:400; color:#000;}

footer > div > div{ margin:auto; width:90%; margin-top:30px;}
footer > div > div > div > h4{ }
footer > div > div > div > h4 > span{ font-size:22px; font-weight:600;}
footer > div > div > div > p{ margin-bottom:16px; }
footer > div > div > div > p > span{ font-size:18px; font-weight:400;}

footer > div > div > ul{ display:flex; margin:auto; flex-wrap:wrap; gap:15px 30px;}
footer > div > div > ul > li{ display:flex;}
footer > div > div > ul > li > label{ font-size:20px; font-weight:400;  }
footer > div > div > ul > li > label:after{ content:":"; margin:0 4px; }
footer > div > div > ul > li > div{ font-size:20px;  font-weight:400; }
footer > div > div > ul > li > div > a{ color:#000; }
footer > div > div > ul > li > div > a:hover{ color:#12176A;}
footer > div > aside{ display:flex; margin:auto; margin-top:50px; width:90%; font-size:18px;  font-weight:400;   }


#AddressFindDiv{ position:fixed; left:0; top:0; width:100%; height:100vh; z-index:501; background-color:rgba(0,0,0,0.7); display:flex; justify-content:center; align-items:center;}
#AddressFindDiv > div{ background-color:#fff; border-radius:8px; box-shadow:1px 1px 8px gray; width:90%; max-width:800px; height:90vh; overflow-y:auto;}
#AddressFindDiv > div > form{ padding:30px; width:calc(100% - 60px);}
#AddressFindDiv > div > form > .searchdiv{ display:flex; gap:4px;}
#AddressFindDiv > div > form > .searchdiv > input[type=text]{ font-size:22px; padding:3px 6px; flex-grow:1;}
#AddressFindDiv > div > form > .searchdiv > a{ border:1px solid #000; padding:0 24px; display:flex; align-items:center; font-size:22px;}
.addrsearchbtn{ background-color:#000; color:#fff;}
.addrclosebtn{ background-color:#fff; color:#000;}
#AddressFindDiv > div > form > p{ color:#004cff; padding:3px 6px;}

#AddressList > table{ width:100%; margin:30px 0;}
#AddressList > table > tbody > tr > th{ border-top:2px solid #ebebeb; border-bottom:1px solid #ebebeb; padding:6px; font-size:18px;}
#AddressList > table > tbody > tr > th:nth-child(1){ width:100px; }
#AddressList > table > tbody > tr > td{ border-bottom:1px solid #ebebeb; padding:6px;  font-size:16px;}
#AddressList > table > tbody > tr > td > a{ font-size:16px; position:relative; display:inline-block;}
#AddressList > table > tbody > tr > td:nth-child(1){ text-align:center;font-weight:bold; font-size:22px;}
#AddressList > table > tbody > tr > td > a:hover{ color:#004cff; }
#AddressList > table > tbody > tr > td > a:hover:before{ color:#004cff; border:1px solid #004cff; }
#AddressList > nav{ display:flex; flex-wrap:wrap; gap:8px; justify-content:center; margin-bottom:30px;}
#AddressList > nav > span
,#AddressList > nav > a{ border:1px solid #000; padding:6px 12px; font-size:16px; text-align:center;}
#AddressList > nav > span{ background-color:#000; color:#fff; }


.popup{ z-index:1000;}
.popup > div{ display:inline-block;}
.popup > div > a{ }
.popup > div > a > .hpimg{ max-width:80vw; max-height:80vh; }
.popup > div > a > .pcimg{ display:none;}
