
@media (max-width:991px) {
    
.logo {
    width: 16rem;
}
.logo.scrolled {
    width: 10rem;
}

}

@media (max-width:767px){

.navbar_custom {
    backdrop-filter: blur(5px);
}
.navbar_custom.scrolled {
    backdrop-filter: blur(0px);
}

.card_new {
    flex-direction: column;
}
.card_new .img_new {
    width: 100%;
    margin: 0 0 0.5rem;
}
.btn_news {
    padding: 0.5rem 0.5rem;
    font-size: 50%;
}
.cont_btn_date p {
    font-size: 70%;
}

#idx_top {
    display: flex;
    align-items: center;
    height: 70vh;
}
#idx_top h2 {
    font-size: 2rem;
    text-align: center;
}
#dark_theme h1 {text-align: center;}
.ttl_clr {
    font-size: 2rem;
}
#idx_top {
    padding: 5rem 0rem 0;
}
.gradd {
    top: 90%;
    right: -10em;
}
.gradient_border_wrapper {
    width: 20em;
    height: 20em;
    border-radius: 20em;
}
.slogan_idx h4 {
    font-size: 11px;
}

.card_bnft {margin: 0.5rem 0;}

#cont_card_bnft {
    background-image: url(../img/bg_02.webp);
    background-size: cover;
    background-attachment: fixed;
    padding: 0 0 30px;
    margin: -13.5rem 0 0;
    z-index: 2;
    position: relative;
}
#cont_card_bnft::before {
    background:  #fff;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    opacity: 0.8;
}

.cont_card_proc {flex-wrap: wrap;}
.card_proc {width: 270px;}
.card_proc .proc_dot {display: none;}
.cont_card_proc::before {display: none;}

#idx_contact h2 {font-size: 2rem;}

.main_mv {flex-direction: column;}
.img_mv {width: 100%;}
.cont_card_mv {
    margin: -3rem 0 0;
    width: 80%;
}
.ttl_mv {font-size: 2rem;}
.ttl_mv_gif {width: 2.5rem;}

#top_ h2 {font-size: 2.5rem;}
 
}

@media (max-width:479px){

	body {
		padding: 0px !important;
	}
	#navigation .navbar-nav.navbar-right li a{
		padding:5px 15px;
	}
	.media,.media-body{
		overflow:inherit!important
	}
	#navigation .navbar-inverse .navbar-nav .active a,
	#navigation .navbar-inverse .navbar-nav .active a:focus,
	#navigation .navbar-nav.navbar-right li a:hover{
		border:none
	}
	.call-to-action p,
	.header-bottom #subscribe-form p{
		font-size:14px
	}
	
	
	#footer p{
		font-size:14px
	}
}

