@charset "UTF-8";
/* CSS Document */
html {
	font-family: "Kozuka Gothic Pro","sans-serif","Times New Roman","Arial Black";
	color: #606060;
	font-size: 1.6vw;
}
@media (max-width:700px) {
  html {
    font-size: 3vw;
  }
}
a:hover {
	transition: all 0.7s ;
	color: #132846;
	text-decoration: none;	
}
.line-a {
	position: absolute;
	display: block;
	border-radius: 0px 17px 17px 0px;
	background-color: #F2F2F2;
	width:180px;
	z-index: -1;
}
.line-b {
  position: absolute;
  border-radius: 17px 0px 0px 17px;
  background-color: #F2F2F2;
  width: 350px;
  z-index: -1;
	right:0%;
}
@media (max-width:700px) {
  .line-b {
    width: 30vw;
  }
}
.icon-1 {
	background-image: url(../img/icon-1.png);
  background-repeat: no-repeat;
  background-position: 24% 1.5vw;
  background-size: 7vw;
}
@media (max-width:700px) {
  .icon-1 {
    background-position: 36% 3vw;
    background-size: 9vw;
  }
}
.icon-2 {
	background-image: url(../img/icon-2.png);
  background-repeat: no-repeat;
  background-position: 86% 2vw;
  background-size: 7vw;
}
@media (max-width:700px) {
  .icon-2 {
    background-position: 49% 2.9vw;
    background-size: 10vw;
  }
}
.icon-3 {
	background-image: url(../img/icon-3.png);
  background-repeat: no-repeat;
  background-position: 40% 1.6vw;
  background-size: 6vw;
}
@media (max-width:700px) {
  .icon-3 {
    background-position: 62% 1.4vw;
    background-size: 10vw;
  }
}
.icon-4 {
	background-image: url(../img/icon-4.png);
  background-repeat: no-repeat;
  background-position: 22% top;
  background-size: 5.1vw;
}
@media (max-width:700px) {
  .icon-4 {
    background-position: 34% top;
    background-size: 7.7vw;
  }
}
.tg {
	margin-left:5vw;
}
.tg span {
	font-size: 1.4vw;
}
@media (max-width:700px) {
  .tg span {
	  font-size: 1.8vw;
  }
}
.tg h2 {
	line-height: 6.5vw;
	font-size: 4vw;
	font-weight:bold;
	letter-spacing:4px;
}
@media (max-width:700px) {
.tg h2 {
	  line-height: 8vw;
	  font-size: 6vw;
	  letter-spacing:3px;
  }
}
.tg p {
	font-size: 2vw;
	font-weight:500;
	letter-spacing:0.3vw;
}
@media (max-width:700px) {
 .tg p {
	  font-size: 3.5vw; 
  }
}
/* ボックス枠にデコレーション*/
.mo {
  position:relative;
}
.mo::before,
.mo::after {
  position:absolute;
  display:block;
  box-sizing:border-box;
  content:"";
  opacity:0;
}
.mo::before {
  top:0;
  left:50%;
  width:0;
  height:100%;
  border-top:1px solid #132846;
  border-bottom:1px solid #132846;
  transition:left 0.3s, width 0.3s, opacity 0.3s;
}
.mo::after {
  left:0;
  top:50%;
  width:100%;
  height:0;
  border-left:1px solid #132846;
  border-right:1px solid #132846;
  transition:top 0.3s, height 0.3s, opacity 0.3s;
}
.mo:hover::before {
  left:0;
  width:100%;
  opacity:1;
}
.mo:hover::after {
  top:0;
  height:100%;
  opacity:1;
}
.pc { display: block !important; }
.sp { display: none !important; }

@media (max-width:700px) {
	.pc { display: none !important; }
  .sp { display: block !important; }
}
/* -----------------------------------------------------
			
header
			
----------------------------------------------------- */
header {
	background-image: url(../img/main.jpg);	
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	width:auto;
	height: 450px;
}
@media (max-width:700px) {
  header {
    height: 60vw;
  }
}
.header-logo {
	padding:50px 0 0 50px
}
@media (max-width:700px) {
  .header-logo {
	  padding:5vw 0 0 5vw;
  }
}
.header-logo img {
	height:4vw;
}
@media (max-width:700px) {
	.header-logo img {
    height:7vw;
	}	
}
.header-h1 {
	margin-top:130px;
}
@media (max-width:700px) {
	.header-h1 {
	  margin-top:20vw;
  }
}
.header-h1 h1{
  color: #fff;
  font-size: 38px;
  margin: 0 auto;
  text-align: center;
  font-weight: bold;
  line-height: 60px;	
	text-shadow: 1px 1px 10px #A2A2A2;
  letter-spacing:0.3vw;
}
@media (max-width:700px) {
	.header-h1 h1{
    font-size: 6vw;
    line-height: 8vw;	
  }
}
.header-nav-1,
.header-nav-2 {
	color:#fff;
	margin-left:6%;
}
.header-nav-1 ul, 
.header-nav-2 ul {
  padding-left: 20px;
  border-left: 1px solid #737373;
}
.header-nav-1 li, 
.header-nav-2 li {
	line-height: 30px;
}

/*プルダウンメニュー*/
.nav-drawer-lang img {
  position:fixed;
  right:110px;
	top:49px;
  width:30px;
  z-index: 2;
}
@media (max-width:700px) {
  .nav-drawer-lang img {
    right:79px;
	  top:23px;
    width:27px;
  }
}
.nav-drawer-lang {
	list-style-type:none;
}
.nav-drawer-lang li {
  font-size: 16px;
  line-height: 30px;
}
.nav-drawer-lang > li > ul {
	display:none;
  padding:20px 20px 10px 20px;
  margin-top:-10px;
  z-index: 1;
}
.nav-drawer-lang > li:hover ul {
  box-shadow:1px 1px 10px rgba(0,0,0,0.4);
  background-color: #FFFFFF;
  border-radius: 5px;
	display:block;
  position:fixed;
  right:73px;
	top:75px;
	list-style-type:none;
}
@media (max-width:700px) {
  .nav-drawer-lang > li:hover ul {
    right:41px;
    top:60px;
  }
}
/*　ハンバーガーボタン　*/
#nav-drawer {
  position:fixed;
	right:40px;
	top:50px;
	z-index: 1;
}
@media (max-width:700px) {
	#nav-drawer {
		right:25px;
		top:25px;
	}	
}
/*チェックボックス等は非表示に*/
.nav-unshown {
  display:none;
}
/*アイコンのスペース*/
#nav-open {
  display: inline-block;
  width: 40px;
  height: 30px;
  vertical-align: middle;
}
@media (max-width:700px) {
  #nav-open {
    width: 30px;
    height: 25px;
  }
}
/*ハンバーガーの形をCSSで表現*/
#nav-open span, #nav-open span:before, #nav-open span:after {
  position: absolute;
  height: 1px;/*線の太さ*/
  width: 35px;/*長さ*/
  border-radius: 3px;
  background: #626262;
  display: block;
  content: '';
  cursor: pointer;
}
@media (max-width:700px) {
  #nav-open span, #nav-open span:before, #nav-open span:after {
    width: 30px;/*長さ*/
  }
}
#nav-open span:before {
  bottom: -12px;
}
@media (max-width:700px) {
  #nav-open span:before {
    bottom: -10px;
  }
}
#nav-open span:after {
  bottom: -24px;
}
@media (max-width:700px) {
  #nav-open span:after {
    bottom: -20px;
  }
}
/*閉じる用の薄黒箇所*/
#nav-close {
  display: none;
  position: fixed;
  z-index: 99;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0;
  transition: .3s ease-in-out;
}
#nav-content ul {
	margin:10px 0;
}
#nav-content a {
  line-height: 26px;
  letter-spacing: 3px;
  position: relative;
  display: inline-block;
  transition: 0.5s;
}
#nav-content a::after {
  position: absolute;
  bottom: 0;
  left: 0;
  content: '';
  width: 0;
  border-bottom: solid 1px #fff;
  transition: 0.5s;
}
#nav-content a:hover::after {
  width: 100%;
}
#nav-content a:hover {
  color: #FFF;
}
#nav-content h3{
	font-size:18px;
	font-weight: 800;
	color:#9F9F9F;
}
#nav-content {
	font-size:14px;
	color:#fff;
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  width: 90%;
  max-width: 250px;/*最大幅（お好みで調整を）*/
  height: 100%;
  background: #132846;
  transition: .3s ease-in-out;
  -webkit-transform: translateX(-105%);
  transform: translateX(-105%);
	padding-bottom:20px;
	padding-left:20px;
  padding-top:30px;
}
#nav-content img {
	width:170px;
}
/*チェックがついたら表示させる*/
#nav-input:checked ~ #nav-close {
  display: block;
  opacity: .5;
}
#nav-input:checked ~ #nav-content {
  -webkit-transform: translateX(0%);
  transform: translateX(0%);
  box-shadow: 6px 0 25px rgba(0,0,0,.15);
}
.news-area {
	display: block;
	margin: 0 auto;
	width: 75%;
	background-color: #ffffff;
	padding:2.5vw 3.5vw;
	margin-top:-50px;
	margin-bottom:50px;
}
@media (max-width:700px) {
  .news-area {
    padding:4vw 4vw;
    width: 90vw;
    margin-top:-7vw;
  }
}
.news-area h2 {
	font-size: 28px;
	color:#ACB1FF;
  letter-spacing: 3px;
}
@media (max-width:700px) {
  .news-area h2 {
	  font-size: 4vw;
	  color:#ACB1FF;
    letter-spacing: 3px;
  }
}
.news-area ul {
	margin-bottom:5vw;
}
.news-area li {
	display: flex;
	margin:17px 0;
}
@media (max-width:700px) {
  .news-area li {
	  display: flex;
	  margin:2vw 0;
  }
}
.news-area p {
  display: inline-block;
  color: #fff;
  font-size: 12px;
  background-color: #132846!important;
  padding: 3px 10px;
  white-space: nowrap;
}
.news-area span {
	margin-left:3vw;
}
.news-area span a:hover {
	text-decoration: underline;
}
.news-area-btn a {
	background: rgb(170,178,255);
	background: linear-gradient(107deg, rgba(170,178,255,1) 0%, rgba(0,212,255,1) 100%);
	display: block;
  text-align: center;
  width: 40%;
  color: #fff;
  padding:15px 20px;
  border-radius: 40px;
  margin: 0 auto;
}
@media (max-width:700px) {
  .news-area-btn a {
    padding:2.3vw 1.5vw;
    width: 50%;
  }
}
.news-area-btn a:hover {
  transition: all 0.7s ;
	color: #132846;
	text-decoration: none;	
}

/* -----------------------------------------------------
			
course
			
----------------------------------------------------- */

.course {
	position:relative;
}
.course b {
	height:400px;
	top:-50px;
}
@media (max-width:700px) {
  .course b {
	  top:-30px;
  }
}
.course-menu {
	display: flex;
	background-color: #F2F2F2;
	margin-top:5vw;
	padding-bottom:6vw;
}
@media (max-width:700px) {
  .course-menu {
    flex-direction: column;
  }
}
.course-long , .course-short { 
	width:100%;
}
@media (max-width:700px) {
  .course-long , .course-short { 
	  width:100%;
  }
}
.course-long img,
.course-short img {
	width:100%;
}
@media (max-width:700px) {
  .course-long img,
  .course-short img {
    object-fit: cover;
    object-position: 0 17%;
	  width:100%;
    height:75vw;
  }
}
.course-long-menu,
.course-short-menu {
	display: inline-block;
	width:80%;
	background-color: #fff;
	padding:0 20px 0px 20px;;
	margin-left:10%;
	margin-top:-50px;
}
@media (max-width:700px) {
  .course-long-menu,
  .course-short-menu {
	  width:90%;
	  padding:0 20px 0px 20px;;
	  margin-left:5%;
	  margin-top:-43px;
  }
}
.course-long h3 , .course-short h3 {
	font-size: 3vw;
	font-weight: 600;
	margin-top:-2vw;
	letter-spacing:3px;
}
@media (max-width:700px) {
  .course-long h3 , .course-short h3 {
    font-size: 7vw;
    margin-top:-4vw;
	  letter-spacing:2px;
  }
}
.course-long p , .course-short p {
	font-size: 1.3vw;
	margin:1vw 0 2vw 0;
}
@media (max-width:700px) {
  .course-long p , .course-short p {
    font-size: 3vw;
  }
}
.course-long li , .course-short li {
  line-height: 70px;
  border-top: 1px solid #D3D3D3;
	padding-left:20px;
}
@media (max-width:700px) {
  .course-long li , .course-short li {
    font-size: 3.5vw;
    line-height: 11vw;
	  padding-left:20px;
  }
}
@media (max-width:700px) {
  .course-long {
    margin-bottom:6vw;
  }
}
.course-long li:last-child , .course-short li:last-child {
	border-bottom: solid 1px #D3D3D3;
	margin-bottom:25px;
}
.course-point {
	color: #fff;
	background-color: #13325C;
	padding-top:80px;
}
.course-point h3 {
	font-size: 40px;
	text-align: center;
	margin-bottom:40px;
}
@media (max-width:700px) {
  .course-point h3 {
	  font-size: 7vw;
  }
}
.course-point-list {
	display: grid;
	grid-template-columns: 1fr 1fr;
}
@media (max-width:700px) {
  .course-point-list {
	  display: grid;
	  grid-template-columns: 1fr;
  }
}
.course-point-1 {
  background-image: url(../img/icon01.png);
	background-size: 6vw;
}
@media (max-width:700px) {
  .course-point-1 {
	  background-size: 11.5vw;
  }
}
.course-point-2 {
  background-image: url(../img/icon02.png);
	background-size: 5vw;
}
@media (max-width:700px) {
  .course-point-2 {
	  background-size: 8vw;
  }
}
.course-point-3 {
  background-image: url(../img/icon03.png);
	background-size: 6vw;
}
@media (max-width:700px) {
  .course-point-3 {
	  background-size: 11vw;
  }
}
.course-point-4 {
  background-image: url(../img/icon04.png);
	background-size: 6vw;
}
@media (max-width:700px) {
  .course-point-4 {
	  background-size: 11vw;
  }
}
.course-point-1,
.course-point-2,
.course-point-3,
.course-point-4 {
	background-repeat: no-repeat;
	padding-left:8vw;
	margin:4vw 4vw;
}
@media (max-width:700px) {
  .course-point-1,
  .course-point-2,
  .course-point-3,
  .course-point-4 {
	  background-repeat: no-repeat;
	  padding-left:15vw;
	  margin:4vw 7vw;
  }
}
.course-point-1 span,
.course-point-2 span,
.course-point-3 span,
.course-point-4 span {
	display: block;
	font-size: 16px;
	margin-bottom:1.7vw;
	letter-spacing:2px;
}
.course-point-1 h4,
.course-point-2 h4, 
.course-point-3 h4,
.course-point-4 h4 {
	font-size: 2vw;
}
@media (max-width:700px) {
  .course-point-1 h4,
  .course-point-2 h4, 
  .course-point-3 h4,
  .course-point-4 h4 {
	  font-size: 4vw;
  }
}
.course-point-1 p, 
.course-point-2 p,
.course-point-3 p,
.course-point-4 p {
	font-size: 16px;
	margin-left:-9vw;
	margin-top:2vw;
	line-height: 25px;
}
@media (max-width:700px) {
  .course-point-1 p, 
  .course-point-2 p,
  .course-point-3 p,
  .course-point-4 p {
	  font-size: 3.3vw;
	  margin-left:-15vw;
	  margin-top:2vw;
	  line-height: 25px;
  }
}
.course-info {
	margin-top:30px;
	padding-bottom:50px;
	display: flex;
	justify-content: center;
}
@media (max-width:700px) {
  .course-info {
    flex-direction: column;
  }
}
.course-info li a {
	display: block;
	text-align: center;
	width:200px;
	border:solid 1px #fff;
	border-radius: 40px;
	padding:15px 20px;
	margin: 0 12px;
}
@media (max-width:700px) {
  .course-info li a {
    margin: 10px auto;
    padding:15px 20px;
    width:85%;
  }
}
.course-info li a:hover {
  background-color: #fff;
  border:solid 1px #fff;
  border-radius: 40px; 
}

/* -----------------------------------------------------
			
tourism
			
----------------------------------------------------- */

.tourism {
	position:relative;
	padding-top:80px;
}
.tourism b {
	height: 80vw;
	top:-60px;
}
.tourism i {
	height: 82vw;
	top:35%;
}
@media (max-width:700px) {
  .tourism i {
	  height: 190vw;
	  top:35%;
  }
}
.tourism-menu {
	display: flex;
}
@media (max-width:700px) {
  .tourism-menu {
    flex-direction: column;
    margin-top:360px;
  }
}
.tourism-img {
	flex-basis: 37%;
}
.tourism-img img {
	border-radius: 0px 17px 17px 0px;
	width: 100%;
}
.img-wrap {
    position: relative;
}
.img-wrap img {
    position: absolute;    
}
@media (max-width:700px) {
  .tourism-img img {
    top:-360px;
    width:60%;
  }
}
.tourism .tg {
	flex-basis: 40%;
}
.tourism .tg string {
	display: inline-block;
	margin-top:50px;
	margin-bottom:50px;
	line-height: 3vw;
  text-align:justify;
}
@media (max-width:700px) {
  .tourism .tg string {
    margin-top:30px;
    line-height: 5vw;
    margin-right:5vw;
  }
}
.tourism-area-btn {
	background: rgb(170,178,255);
	background: linear-gradient(107deg, rgba(170,178,255,1) 0%, rgba(0,212,255,1) 100%);
	display: block;
  text-align: center;
  width: 60%;
  color: #fff;
  padding: 12px 15px;
  border-radius: 40px;
  margin: 0 auto;
}
/* -----------------------------------------------------
			
follow
			
----------------------------------------------------- */
.follow {
	margin-top:10vw;
}
.follow-li {
  background: rgb(239,255,219);
  background: linear-gradient(54deg, rgba(239,255,219,1) 0%, rgba(208,240,253,1) 100%);
	display: block;
	width:100%;
	height:100px;
	margin-top:-30px;
}
@media (max-width:700px) {
  .follow-li {
    margin-top:-18px;
  }
}
.follow-li ul {
	display: flex;
	justify-content: center;
}
.follow-li li {
	display: block;
	padding:30px 20px 0 20px;
	height:100px;
}
.follow-li img {
	height:40px;
  fill: #42AFE3;
}
@media (max-width:700px) {
  .follow-li img {
	  height:34px;	
  }
}

/* -----------------------------------------------------
			
environment
			
----------------------------------------------------- */

.environment {
	position:relative;
	padding-top:10vw;
}
@media (max-width:700px) {
  .environment {
	  padding-top:18vw;
  }
}
.environment b {
	height:258vw;
	top:50px;
}
@media (max-width:700px) {
  .environment b {
	  height:382vw;
  }
}
.environment-main {
	margin-top:50px;
}
@media (max-width:700px) {
  .environment-main {
	  margin-top:35px;
  }
}
.environment-main img {
	width:100%;
}
@media (max-width:700px) {
  .environment-main img {
    object-fit: cover;
    object-position: 47% 0%;
	  width:100%;
    height:75vw;
  }
}
.environment-int {
	display: inline-block;
	background-color: #fff;
	width: 45vw;
	padding:5vw;
	margin:-177px 0 0 5vw;
}
@media (max-width:700px) {
  .environment-int {
    width: 72vw;
    margin:-64px 0 0 5vw;
  }
}
.environment-int h3,
.dormitory-int h3,
.classroom-int h3 {
	font-size: 2.3vw;
	font-weight: 600;
  letter-spacing: 3px;
}
@media (max-width:700px) {
  .environment-int h3,
  .dormitory-int h3,
  .classroom-int h3 {
	  font-size: 4.3vw;
	  font-weight: 600;
    letter-spacing: 3px;
  }
}
.environment-int p,
.dormitory-int p,
.classroom-int p {
	display: inline-block;
  margin-top: 3vw;
  margin-bottom: 5vw;
  line-height: 3vw;
}
@media (max-width:700px) {
  .environment-int p,
  .dormitory-int p,
  .classroom-int p {
    line-height: 5vw;
  }
}
.environment-btn {
	background: rgb(170,178,255);
	background: linear-gradient(107deg, rgba(170,178,255,1) 0%, rgba(0,212,255,1) 100%);
	display: block;
  text-align: center;
  width: 53%;
  color: #fff;
  padding: 12px 15px;
  border-radius: 40px;
  margin: 0 auto;
}
.environment-dormitory {
	width: 50vw;
	margin:-17vw 0 0 48vw;
}
@media (max-width:700px) {
  .environment-dormitory {
	  margin:10vw 0 0 26vw;
  }
}
.environment-dormitory img {
	width: 46vw;
}
@media (max-width:700px) {
  .environment-dormitory img {
	  width: 67vw;
  }
}
.dormitory {
	position: relative;
}
.dormitory-int {
	display: inline-block;
  background-color: #fff;
  width: 60vw;
  padding: 5vw;
  margin: -5vw 0 0 -20vw;
}
@media (max-width:700px) {
  .dormitory-int {
    width: 80vw;
  }
}
.environment-classroom {
	width: 50vw;
	margin:10vw 0 0 10vw;
}
@media (max-width:700px) {
  .environment-classroom {
	  margin:10vw 0 0 5vw;
  }
}
.environment-classroom i {
	height: 950px;
	top:80%;
}
@media (max-width:700px) {
  .environment-classroom i {
	  height: 950px;
	  top:77%;
  }
}
.environment-classroom img {
	width: 60vw;
}
@media (max-width:700px) {
  .environment-classroom img {
	  width: 67vw;
  }
}
.classroom {
	position: relative;
}
.classroom-int {
	display: inline-block;
  background-color: #fff;
  width: 71vw;
  padding: 5vw;
  margin: -5vw 0 0 7vw;
}
@media (max-width:700px) {
  .classroom-int {
    width: 83vw;
  }
}
.classroom-btn {
	background: rgb(170,178,255);
	background: linear-gradient(107deg, rgba(170,178,255,1) 0%, rgba(0,212,255,1) 100%);
	display: block;
  text-align: center;
  width: 45%;
  color: #fff;
  padding: 12px 15px;
  border-radius: 40px;
  margin: 0 auto;
}
@media (max-width:700px) {
  .classroom-btn {
    width: 65%;
  }
}
/* -----------------------------------------------------
			
access
			
----------------------------------------------------- */
.access {
  position:relative;
	margin-top:100px;
}
.access b {
  top:50px;
	height:550px;
}
@media (max-width:700px) {
  .access b {
	  height:500px;
  }
}
.access-iframe-map {
	width: 100%;
  height: 300px;
  margin-bottom: 50px;
	margin-top:50px;
}
@media (max-width:700px) {
  .access-iframe-map {
	  margin-top:25px;
  }
}
.access-btn {
	background: rgb(170,178,255);
	background: linear-gradient(107deg, rgba(170,178,255,1) 0%, rgba(0,212,255,1) 100%);
	display: block;
  text-align: center;
  width: 25%;
  color: #fff;
  padding: 12px 15px;
  border-radius: 40px;
  margin: 0 auto;
}
@media (max-width:700px) {
 .access-btn {
    width: 45%;
  }
}

/* -----------------------------------------------------
			
sns
			
----------------------------------------------------- */

.sns {
  display: flex;
  margin-top:140px;
}
@media (max-width:700px) {
  .sns {
    display: flex;
    flex-direction: column;
  }
}
.sns-qa {
  width:100%;
  margin-right:50px;
}
@media (max-width:700px) {
  .sns-qa {
    width:90%;
  }
}
.sns-qa-li {
  margin-top:20px;
}
@media (max-width:700px) {
  .sns-qa-li {
    margin-top:12px;
  }
}
.fb-page {
  margin-top:20px;
  width:400px;
}
@media (max-width:700px) {
  .fb-page {
    margin-top:20px;
    width:350px;
    margin-bottom:50px;
  }
}

/*アコーディオン*/
.acd-check{
  display: none;
}
.acd-label{
	background-color: #fff;
	font-size:14px;
  display: block;
  margin-bottom: 1px;
  padding: 10px 40px 10px 10px;
  position: relative;
  border: 4px solid #C2C2C2;
}
@media (max-width:700px) {
  .acd-label{
    font-size:2.7vw;
  }
}
.acd-label:after{
  box-sizing: border-box;
  font-family: "Font Awesome 5 Free";
  content: '\f067';
  display: block;
  font-weight: 900;
  height: 52px;
  padding: 10px 15px 10px 20px;
  position: absolute;
  right: 0;
  top: 0px;
}
.acd-content{
  display: block;
  height: 0;
  opacity: 0;
  padding: 0 10px;
  transition: .5s;
  visibility: hidden;
}
.acd-content p {
  font-size: 14px;
  letter-spacing: 0;
  font-weight: normal;
  line-height: 25px;
}
.acd-content a {
  color: #008AFF;
  font-weight: 600;
}
.acd-content a:hover {
  color: #606060;
  transition: all 0.7s ;
  font-weight: 600;
  text-decoration:underline;
}
.acd-check:checked + .acd-label:after{
  content: '\f068';
}
.acd-check:checked + .acd-label + .acd-content{
  height: auto;
  opacity: 1;
  padding: 10px;
  visibility: visible;
}

/* -----------------------------------------------------
			
footer
			
----------------------------------------------------- */

footer {
  background-image: url("../img/footer-img.png");
  background-repeat: no-repeat;
  background-color: #F2F2F2;
  margin-top:50px;
  padding:50px 30px 0 30px;
  background-size: contain;
  background-position:bottom;
}
@media (max-width:700px) {
  footer {
    padding:20px 0 0 0;
    background-size: 117vw;
    background-position:left bottom;
  }
}
.ft-info {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(1, 0fr);
}
@media (max-width:700px) {
  .ft-info {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    grid-template-rows: repeat(4, 220px);
  }
}
.ft-info-1,
.ft-info-2,
.ft-info-3 {
  text-align: center;
  background-color: #fff;
  border-radius: 17px 17px 17px 17px;
  padding:30px 0;
  margin:20px;
}
@media (max-width:700px) {
  .ft-info-1 {
    grid-column: 1/4;
    grid-row: 1/2;
  }
}
@media (max-width:700px) {
  .ft-info-2 {
    grid-column: 1/4;
    grid-row: 2/3;
  }
}
@media (max-width:700px) {
  .ft-info-3 {
    grid-column: 1/4;
    grid-row: 3/4;
  }
}
.ft-info-4 {
  grid-column: 1/4;
  grid-row: 2/3;
  text-align: left;
  background-color: #fff;
  border-radius: 17px 17px 17px 17px;
  padding:50px 0;
  margin:20px 20px 80px 20px;
}
@media (max-width:700px) {
  .ft-info-4 {
    grid-column: 1/4;
    grid-row: 4/5;
    margin:20px;
    text-align: center;
    padding:30px 0 ;
  }
}
.ft-info-1 img,
.ft-info-2 img {
  width:3vw;
}
@media (max-width:700px) {
  .ft-info-1 img {
    width:7vw;
  }
}
@media (max-width:700px) {
  .ft-info-2 img {
    width:8vw;
  }
}
.ft-info-2 img {
  margin:10px 0;
}
.ft-info-3 img {
  width:2vw;
}
@media (max-width:700px) {
  .ft-info-3 img {
    width:5vw;
  }
}
.ft-info-1 h3,
.ft-info-2 h3,
.ft-info-3 h3 {
  margin:20px 0;
  font-size: 18px;
}
.ft-info-1 p,
.ft-info-2 p,
.ft-info-3 p {
  font-size: 14px;
  text-align: center!important;
}
.ft-info-4 div {
  display: grid;
  justify-content:center;
  grid-template-columns: 9vw 250px auto;
  grid-template-rows: repeat(1, 0fr);
}
@media (max-width:700px) {
  .ft-info-4 div {
    display: grid;
    grid-template-columns: 15vw auto;
    grid-template-rows: 27px 24px 35px 30px;
  }
}
.ft-info-4 img {
  width:50px;
  grid-column: 1/2;
  grid-row: 1/3;
}
@media (max-width:700px) {
  .ft-info-4 img {
    width:40px;
    grid-column: 1/2;
    grid-row: 1/3;
    margin-top: 3px;
  }
}
.ft-info-4 h3 {
  font-size: 23px;
  text-align: left;
  letter-spacing: 3px;
}
@media (max-width:700px) {
  .ft-info-4 h3 {
    font-size: 20px;
  }
}
.ft-info-4 p {
  font-size: 14px;
}
@media (max-width:700px) {
  .ft-info-4 p {
    font-size: 12px;
  }
}
.ft-info-4 string {
  font-size: 26px;
  letter-spacing: 3px;
}
@media (max-width:700px) {
  .ft-info-4 string {
    font-size: 22px;
    grid-column: 1/3;
    grid-row: 3/4;
  }
}
.ft-info-4 em {
  font-size: 18px;
  border: solid 1px #606060;
  border-radius: 40px;
  text-align: center;
  line-height: 26px;
}
@media (max-width:700px) {
  .ft-info-4 em {
    display: block;
    margin:0 auto;
    width:55vw;
    font-size: 14px;
    grid-column: 1/3;
    grid-row: 4/5;
    letter-spacing: 1px;
  }
}
.ft-menu {
  display: grid;
  grid-template-columns: 1fr 2fr 4fr;
  font-size:14px;
  margin-left:20px;
  padding-bottom:300px;
}
@media (max-width:700px) {
  .ft-menu {
    grid-template-columns: 150px auto;
    padding-bottom:150px;
  }
}
@media (max-width:700px) {
  .ft-menu-1 {
    margin-top:20px;
    grid-column: 1/3;
    grid-row: 2/3;
  }
}
.ft-menu img {
  width:250px;
}
@media (max-width:700px) {
  .ft-menu img {
    width:200px;
  }
}
.ft-menu-1 img:hover {
	opacity: 0.6;
  transition: all 1s ;
}
.ft-menu-1 ul {
  margin-top:30px;
  line-height: 22px;
}
.ft-menu-1 li:last-child {
  margin-top:30px;
  letter-spacing: 2px;
}
.ft-menu-2,
.ft-menu-3 {
  margin-left:50px;
  margin-top:5px;
}
@media (max-width:700px) {
  .ft-menu-2 {
    margin-left:0px;
    grid-column: 1/2;
    grid-row: 1/2;
  }
}
@media (max-width:700px) {
  .ft-menu-3 {
    grid-column: 2/3;
    grid-row: 1/2;
  }
}
.ft-menu-2 h3,
.ft-menu-3 h3 {
  font-size: 20px;
  letter-spacing: 3px;
}
.ft-menu-2 ul,
.ft-menu-3 ul {
  margin-top:10px;
}
.ft-menu-2 li a,
.ft-menu-3 li a {
  line-height: 26px;
  letter-spacing: 3px;
  position: relative;
  display: inline-block;
  transition: 0.5s;
}
.ft-menu-2 li a::after,
.ft-menu-3 li a::after {
  position: absolute;
  bottom: 0;
  left: 0;
  content: '';
  width: 0;
  border-bottom: solid 1px #001E38;
  transition: 0.5s;
}
.ft-menu-2 li a:hover::after,
.ft-menu-3 li a:hover::after {
  width: 100%;
}
.card {
  position:relative;
}
.card::before,
.card::after {
  position:absolute;
  display:block;
  box-sizing:border-box;
  content:"";
  opacity:0;
}
.card::before {
  top:0;
  left:50%;
  width:0;
  height:100%;
  border-top:1px solid #001E38;
  border-bottom:1px solid #001E38;
  transition:left 0.3s, width 0.3s, opacity 0.3s;
  border-radius: 17px 17px 17px 17px;
}
.card::after {
  left:0;
  top:50%;
  width:100%;
  height:0;
  border-left:1px solid #001E38;
  border-right:1px solid #001E38;
  transition:top 0.3s, height 0.3s, opacity 0.3s;
  border-radius: 17px 17px 17px 17px;
}
.card:hover::before {
  left:0;
  width:100%;
  opacity:1;
}
.card:hover::after {
  top:0;
  height:100%;
  opacity:1;
}