body{
  width: 100vw;

  background-color: #000;
 /* background-image: url(../source/img/info/main_visual.png);
  background-size: cover;
  background-repeat: no-repeat;
  height: calc(var(--vh, 1vh)* 100);*/
}

 body > section {
    width: 100%;
    min-height:80vh;
    display: flex;
    flex-direction: row;    
     background-color: #000;
    background-image: url(../source/img/info/main_visual.png);    
    background-repeat: no-repeat;
    background-size: cover;
  }

.foot {
	width: 100vw;
	height: 160px;
}
/* 입장 패널 */
article.enter{
  width: 100vw;
  height: 400px;
  position: absolute;
  top: calc(42vw + 60px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
article.enter > div.boder{
  width: 50px;
  height: 50px;
  margin: 20px;
  position: absolute;
}
article.enter > div.boder:nth-child(1){
  top: 0;
  left: 0;
  border-top: 10px solid #fff;
  border-left: 10px solid #fff;
}
article.enter > div.boder:nth-child(2){
  top: 0;
  right: 0;
  border-top: 10px solid #fff;
  border-right: 10px solid #fff;
}
article.enter > div.boder:nth-child(3){
  bottom: 0;
  left: 0;
  border-bottom: 10px solid #fff;
  border-left: 10px solid #fff;
}
article.enter > div.boder:nth-child(4){
  bottom: 0;
  right: 0;
  border-bottom: 10px solid #fff;
  border-right: 10px solid #fff;
}
a.enter{
  width: 75px;
  height: 75px;
  margin: 62.5px;

  display: inline-block;
  background-color: #c8e3a6;
  border-radius: 200px;
  box-shadow: 0px 0px 30px 30px #c8e3a6;
}
a.enter:hover{
  background-color: var(--mainGreen);
  box-shadow: 0px 0px 50px 50px var(--mainGreen);
}

a.enterStyle2 > img{
  width: 160px;
  animation: moveLR 5s ease-in-out infinite;
}
#enter{
  margin: -62.5px;
  width: 200px;
  border-radius: 200px;
}
#enter > g{
  -webkit-transform-origin: center;
  transform-origin: 50% 49%;
  animation: rotate 2.5s ease-in-out infinite;
}
/* 콘텐츠 패널 */
article.content > .maintitle{
  /*height: 23vw;*/
  /*font-size: 5vw;*/
  margin: 16% 20px 0;
  margin-bottom: 0px;
  text-align:center;
  line-height: normal;
}
article.content > .subtitle{
  font-size: 2vw;
  margin: 20px;
  margin-top: 0px;
  text-align:center
}
article.content > .text{
  height: 12vw;
  margin: 10px 30px;
  font-size: 2vw;
  line-height:nomal;
  box-sizing: border-box;
  border-top: 1px solid #fff;
 
  display: flex;
  align-items: center;
  justify-content: center;
     line-height: normal;
  text-align: center;
}
/* 네비 */
nav{
  margin-top: 20px;
}
nav > ul > li{
  width: 25vw;
  aspect-ratio: 1/1;
  display: flex;
  align-items: center;
  justify-content: center;
}
nav > ul > li > a{
  width: 80%;
  max-width: 150px;
  min-width: 80px;
  min-height: 150px;
  aspect-ratio: 1/1;
  border-radius: 18px;
  display: inline-block;
  font-size: 12pt;
}
nav > ul > li > a > img{
  width: 75%;
  height: 80px;
}
nav > ul > li > a > p{
  width: 80px;
  height: 44px;
  padding-top: 10px;

  box-sizing: border-box;
  border-top: 2px solid #fff;
  text-align: center;
}
nav > ul > li > a:hover{
  background-color: var(--mainGreen);
  box-shadow: inset 0 0 10px #2227;
}
nav > ul > li > a:hover > p{
  font-weight: 800;
  color: var(--fontWhite);
}
@keyframes rotate {
  50% { /* 애니메이션 종료 시점 */
    transform: rotate(135deg);
  }
  100% { /* 애니메이션 종료 시점 */
    transform: rotate(270deg);
  }
}
@keyframes moveLR {
  0%{
  }
  25%{
    transform: translateX(15px) rotate(5deg);
  }
  75%{
    transform: translateX(-15px) rotate(-5deg);
  }
}
footer{
	width: 100%;
	min-height: 100px;	
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
footer > .logoBox{
  display: flex;
}
footer > .logoBox > a{
  display: flex;
  align-items: center;
}
.ministryText{
  display: inline-block;
  font-size: 10px;
  color: #4f4f4f;
  margin-left: -15px;
  margin-right: 10px;
  margin-bottom: 15px;
}
img{
	width: 120px;
	margin-bottom: 15px;
}
footer > select{
  margin: 0 0 10px 0;
  padding: 2px 6px;
  width: 180px;
  box-sizing: border-box;
}
.footText{
	text-align: center;
	font-size: 14px;
}
.link{
	margin-bottom: 12px;
	font-size: 12px;
}
.link a:nth-child(2){
	border-left: 2px solid var(--fontLightColor);
	border-right: 2px solid var(--fontLightColor);
	padding: 0 9px;
	margin: 0 5px;
}

@media (min-width: 1330px) {
  body{
    width: 100vw;
    height: 100vh; 
   
   
  }
 
  body > section > .enter{
    width: 50vw;
    height: 100%;
    position: static;
  }
  article.enter > div.boder:nth-child(1){
    top: 0;
    left: 0;
  }
  article.enter > div.boder:nth-child(2){
    top: 0;
    right: 50vw;
  }
  article.enter > div.boder:nth-child(3){
    bottom: 110px;
    left: 0;
  }
  article.enter > div.boder:nth-child(4){
    bottom: 110px;
    right: 50vw;
  }
  a.enterStyle2 > img{
    width: 280px;
  }
  article.content{
    width: 50vw;
    display: flex;
    flex-direction: column;
    justify-content: right;
    margin:0 auto;
    padding-top:6%;
  }
  article.content > .maintitle{
    height: auto;
    font-size: 4.2vw;
    margin: 20px;
    text-align: center;
     line-height: normal;
  }
  article.content > .subtitle{
    font-size: 2vw;
    margin: 20px;
    margin-top: 0px;
  }
  article.content > .text{   
    height: auto;
    margin: 0;   
    padding: 20px 0 5px;
    font-size: 22px;
    line-height: normal;
    text-align: center;
  }
  .blank{
    flex-grow: 1;
  }
  nav > ul > li > a{
    width: 90%;
  }

  footer{
    width: 100vw;
    height: 130px;
    padding: 20px;
    box-sizing: border-box;
  
    margin: 0 auto;
    display: flex;
    flex-direction: row;
  }
  footer > select{
    margin: 0 20px;
    padding: 3px 10px;
    width: 180px;
    box-sizing: border-box;
  }
  img{
    width: 200px;
    margin-bottom: 0;
  }
  .ministryText{
    font-size: 15px;
    margin-bottom: 0;
  }
  .blank{
    flex-grow: 1;
  }
  .footText{
    text-align: right;
  }
  .footText .link{
    font-size: 12px;
  }

}
.main_btxarea{text-align:center; margin-top:20px}
.main_btn {border:1px solid #fff; border-radius:3px; background:none; color:#fff; font-size:20px; padding:12px 30px; text-align:center; display:inline-block; font-weight:bold}
.main_btn:hover{background:#fff; color:#000;}


@media (max-width:1329px){
.main_btn {font-size:16px}	
	
	
	}
@media (max-width:640px){	
	
	article.content > .text {font-size:14px; height:auto; text-align:center; padding-top:20px}
	article.content > .maintitle {margin: 25% 20px 0;}
	
	
	}


