@charset "utf-8";
/* CSS Document */
* {-webkit-text-size-adjust:none;}
a:link {text-decoration: none; color: #1f1f1f;}
a:visited {text-decoration: none; color: #1f1f1f;}
a:active {text-decoration: none; color: #1f1f1f;}
a:hover {text-decoration: none; color: #0096d9;}

a:link.type1{ text-decoration: none; color: #ffffff;}
a:visited.type1{ text-decoration: none; color: #ffffff;}
a:active.type1{ text-decoration: none; color: #ffffff;}
a:hover.type1{ text-decoration: none; color: #000000;}

a:link.type2{ text-decoration: none; color: #ffffff; }
a:visited.type2{ text-decoration: none; color: #ffffff;}
a:active.type2{ text-decoration: none; color: #ffffff;}
a:hover.type2{ text-decoration: none; color: #00b8cc;}

a:link.type3{ text-decoration: none; color: #00b8cc; }
a:visited.type3{ text-decoration: none; color: #00b8cc;}
a:active.type3{ text-decoration: none; color: #00b8cc;}
a:hover.type3{ text-decoration: none; color: #ffffff;}

a:link.type4{ text-decoration: none; color: #909ea0; }
a:visited.type4{ text-decoration: none; color: #909ea0;}
a:active.type4{ text-decoration: none; color: #909ea0;}
a:hover.type4{ text-decoration: none; color: #ff4800;}

a:link.type5{ text-decoration: none; color: #000000; }
a:visited.type5{ text-decoration: none; color: #000000;}
a:active.type5{ text-decoration: none; color: #000000;}
a:hover.type5{ text-decoration: none; color: #00b8cc;}

img {border:0px;}

@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);

@import url('https://fonts.googleapis.com/css?family=Pinyon+Script');

#wrap1 {
   	width: 100%;
	text-align: center;
background-color: #efeff4;

}
#wrap2 {
    width: 100%;
background-color: #444444;

	
}
#wrap3 {
    width: 100%;


}
.header1 {
	margin:0 auto;
	width:1140px;
	height:106px;
	font-size:23px;
}

.content {
	margin:0 auto;
	width:1140px;
	height:870px;
    text-align: center;

}

.footer {
	margin:0 auto;
	width:1140px;
	text-align:left;
	height:220px;
	

}

ul.menu {
  display: flex;
  justify-content: space-evenly;
  padding: 0px;
  width: 820px;
  height: 40px; 
}
 
ul.menu > li {
    display:inline;
	padding:0 6px;
}

@font-face {
  font-family: 'HelveticaNeueLTPro-UltLt';
  src: url('font/HelveticaNeueLTPro-UltLt.eot?#iefix') format('embedded-opentype'),  url('font/HelveticaNeueLTPro-UltLt.otf')  format('opentype'),
	     url('font/HelveticaNeueLTPro-UltLt.woff') format('woff'), url('font/HelveticaNeueLTPro-UltLt.ttf')  format('truetype'), url('font/HelveticaNeueLTPro-UltLt.svg#HelveticaNeueLTPro-UltLt') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'MyriadPro-Regular';
  src: url('font/MyriadPro-Regular.eot?#iefix') format('embedded-opentype'),  url('font/MyriadPro-Regular.otf')  format('opentype'),
	     url('font/MyriadPro-Regular.woff') format('woff'), url('font/MyriadPro-Regular.ttf')  format('truetype'), url('font/MyriadPro-Regular.svg#MyriadPro-Regular') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'TrajanPro-Regular';
  src: url('font/TrajanPro-Regular.eot?#iefix') format('embedded-opentype'),  url('font/TrajanPro-Regular.otf')  format('opentype'),
	     url('font/TrajanPro-Regular.woff') format('woff'), url('font/TrajanPro-Regular.ttf')  format('truetype'), url('font/TrajanPro-Regular.svg#TrajanPro-Regular') format('svg');
  font-weight: normal;
  font-style: normal;
}
/* pinyon-script-regular - latin */
@font-face {
  font-family: 'Pinyon Script';
  font-style: normal;
  font-weight: 400;
  src: url('font/pinyon-script-v7-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('font/Pinyon Script'), local('PinyonScript'),
       url('font/pinyon-script-v7-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('font/pinyon-script-v7-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('font/pinyon-script-v7-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('font/pinyon-script-v7-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('font/pinyon-script-v7-latin-regular.svg#PinyonScript') format('svg'); /* Legacy iOS */
}
	.wrapper {
  width: 100%;
  /* whatever width you want */
  display: inline-block;
  position: relative;
}
.wrapper:after {
  padding-top: 35%;
  /* 16:9 ratio */
  display: block;
  content: '';
}
div.inner {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%,-50%);
    width:940px; height:110px;
	font-family: 'HelveticaNeueLTPro-UltLt';
    }
/* 버튼효과 - Bounce To Top */
.button-basic {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  border:1px solid #b7b7b7;
  background: #f1f1f3;
  position: relative;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
}
.button-basic:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #0096d9;
  -webkit-transform: scaleY(0);
  transform: scaleY(0);
  -webkit-transform-origin: 50% 100%;
  transform-origin: 50% 100%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.button-basic:hover, .button-basic:focus, .button-basic:active {
  color: black;
}
.button-basic:hover:before, 
.button-basic:focus:before, 
.button-basic:active:before {
  -webkit-transform: scaleY(1);
  transform: scaleY(1);
  -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
  transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
}

.cert {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  width: 1100px;
  margin: 0 auto 60px;
}

.cert div:hover {
  cursor: pointer;
}

.cert img {
  width: 235px;
  height: 350px;
  margin: 10px;
  border: 1px solid #000;
}

.cert p {
  font-size: 22px;
  max-width: 230px;
  margin: 0 auto;
  white-space: normal;
  word-break: keep-all;
  text-align: center;
  cursor: pointer;
  line-height: 1.3;
}

.lightbox {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.9);
  z-index: 1000;
}

.lightbox-content {
  position: relative;
  max-width: 90%;
  max-height: 90%;
  margin: 20px auto;
  display: flex;
  justify-content: center;
  align-items: center;
}

.lightbox img {
  max-width: 600px;
}

.close-btn {
  position: absolute;
  top: 20px;
  right: 20px;
  color: white;
  font-size: 30px;
  cursor: pointer;
}