*{
    box-sizing: border-box;
}
a{text-decoration: none;}
.text-align{text-align: center;}
.align-items-c{align-items: center;}
.txt-w{color: #fff;}
p{margin: 0;}


img{width: 100%;}


#fp-nav ul li .fp-tooltip{color:tomato}
#fp-nav ul li a span{background-color: tomato;}
.mob{display: none;}
/* .web{display: block;} */
.mob-scroll-box{
    display: flex;
    flex-wrap: wrap;
}
.container-70{max-width: 70%; margin: auto;}
.flex-wrap{flex-wrap: wrap;}

body{
    background-color: #FFF7F7;
}
html {
    scroll-behavior: smooth;
  }

@media (max-width: 768px) {
    .container-70{
        max-width: 100%;
        padding-right: 15px;
        padding-left: 15px;
        margin-right: auto;
        margin-left: auto;
    }
    .mob-scroll-box{
        height: 340px;
        overflow: scroll;
    }
    .go-back{
        text-align: end;
        font-size: 14px;
        color: #555;
    }
    .mob{display: block;}
    .web{display: none;}
    .main-link-box{
        margin-bottom: 15px;
        padding: 0;
    }
}
.link-box{border: transparent solid 4px;}
.link-box:hover {
    border: #074088 solid 4px;
    transition: .5s all;
}


/* ------------------- header -------------------- */
.navbar{position: fixed; padding: 0; background-color: #1e1e1e; z-index: 99;}
.navtop{ z-index: 100; width: 100%;padding:5px 13px;justify-content: center;}
.container-fluid {
    max-width: 100vw;
    padding: 0;
  }
.navtop img{height: 45px; object-fit: contain; margin-right: 24px;}  
.navbar-brand{margin: 0;}
@media (max-width: 768px) {
    .navbar-brand{ padding: 0; margin: 0; }
}

/* ------------------- open -------------------- */

.open-bg{width: 100%;height: 700px; object-fit: cover; margin-top: 50px;}

@media (max-width: 1280px) {
    .open-bg{
        height: 500px;
    }
}
@media (max-width: 1080px) {
    .open-bg{
        height: 550px;
    }
}
@media (max-width: 965px) {
    .open-bg{
        height: 500px;
    }
}
@media (max-width: 768px) {
    .open-bg{
        height: 340px;
        /*object-position: right;*/
    }
}

/* ------------------ main -------------------- */
.txt-02{
    background-image: linear-gradient(transparent 70%,#ffd876 0);
    display: inline;
    color: #1e1e1e;
}
.txt-03{
    line-height: 36px;
    font-weight: 400;
}

.main-info{
    display: flex;
    position: relative;
}
.info-area{
    display: grid;
    align-content: center;
}
.btn{
    position: absolute;
    bottom: 0%;
    right: 0%;
    top: 0%;
}

.btn-3d {
	position: relative;
	display: inline-block;
	font-size: 28px;
	padding: 7.5px 30px;
	color: white;
	margin: 0;
	border-radius: 50px;
	text-align: center;
	transition: top .01s linear;
	text-shadow: 0 1px 0 rgba(0,0,0,0.15);
}
.btn-3d.red {
	background-color: #E3003B;
	box-shadow: 0 0 0 1px #c63702 inset,
        0 0 0 2px rgba(255,255,255,0.15) inset,
        0 8px 0 0 #AB002C,
        0 8px 0 1px rgba(0,0,0,0.4),
				0 8px 8px 1px rgba(0,0,0,0.5);
}
.btn-3d.red:active {
	box-shadow: 0 0 0 1px #AB002C inset,
				0 0 0 2px rgba(255,255,255,0.15) inset,
				0 0 0 1px rgba(0,0,0,0.4);
}
.btn-3d.red:hover{
    color: #fff;
    text-decoration: none;
    background-color: #E3003B;}
.btn-3d:active {
	top: 9px;
}



@media (max-width: 768px) {

    #main h1{font-size: 36px;}
    #main h2{font-size: 24px;}
    .txt-03{
        font-size: 21px;
        text-align: justify;
        line-height: 32px;
    }
    .btn{
        margin-top: 30px;
        position: unset;
    }
    .btn-3d.red {
        font-size: 24px;
        background-color: #E3003B;
        box-shadow: unset;
    }
    .info-area{
        margin-top: 1.5rem;
    }
    .info-area h4{
        font-size: 21px;
        text-align: center;
        line-height: 32px;
    }
    .info-area h5{
        text-align: center;
    }
    .info-area ul{
        padding-inline-start: 20px;
        margin: auto;
        display: table;}
}



/* ------img-info-------- */


.info-num{
    font-family: 'Oswald', sans-serif;
    font-size: 24px;
}
.info-num:first-letter {
    font-size : 240%;
    font-weight : bold;
    float : left;
    padding-right: 15px;
    line-height: 100%;
    }

#img-info .point img{width: 40%; margin: auto;}
.point{
    height: 100%;
    display: flex;
    flex-wrap: wrap;
    background-color: #e5effb;
    border-radius: 50px;
    padding: 20px;
}


.object {
    width: 100%;
    animation: MoveUpDown 1s linear infinite;
    position: absolute;
    bottom:50%;
    left: 50%;
    transform: translate(-50%, 100%);
    color: #f26868;
  }

  #m-school .info-area h5{
    font-size: 18px;
    line-height: 27px;
    
  }
  
  @keyframes MoveUpDown {
    0%, 100% {
      bottom: 0;
    }
    50% {
      bottom: 10px;
    }
  }

  @media (max-width: 768px) {
    .object {
        font-size: 16px;
        animation: unset;
      }
      #surveycake iframe{height: 800px;}
      #m-school .info-area h5{
        font-size: 16px;
        line-height: 24px;
      }
      .title-h2{
        font-size: 28px;
      }
}



#article{
    background-color: #ededed;
    padding: 20px;
    color: #1e1e1e;
    font-size: 12px;
    text-align: center;
}

footer{
    background-color: #1e1e1e;
    padding: 10px;
    color: #ededed;
    font-size: 12px;
    text-align: center;
}
@media (max-width: 768px) {
    /* footer{
        margin-bottom: 70px;
    } */
}