@charset "UTF-8";


@media screen and (min-width: 576px) {
    .flex{
        display:flex;
        justify-content: space-evenly;
    }
    .pc{
        display:block !important;
    }
    .sp{
        display:none !important;
    }
    
}
@media screen and (max-width: 577px) {
    .flex{
        display: :block;
    }
    .sp{
        display:block !important;
    }
    .pc{
        display:none !important;
    }
}


/* 中デバイス（タブレット, 768px 未満）
============================================== */
@media screen and (max-width: 767.98px) {
h2 { font-size: 1.2rem !important; }
.logo { width: 75%; }
.balloon, .balloon-s {
	width: 120px;
	height: 120px;
	top: -60px;
	left: 4px;
	font-size: 14px;
}
}/* END */

/* 極小デバイス（縦向きモバイル, 576px 以上）
============================================== */
@media screen and (min-width: 576px) {
.catch-copy {
	margin: 0 10px;
	font-weight: bold;
/*	text-align: center;*/
    text-align: center;
	color: #fff;
	padding-top: 80px;
	text-shadow: 3px 0px 2px #333, 0px 3px 2px #333, -1px 0px 2px #333, 0px -1px 2px #333;
/*    padding-left: 5vw;    */
    position: absolute;
    bottom:50%;
    left:35%;
    line-height: 65px;
    font-family: monospace;
}
    .display-4{
        font-size:2.5vw !important;
    }
#Navbar ul li {
	background-color: #fff;
	border-radius: 50%;
	display: table;
	margin-right: 5px;
}
#Navbar ul li:last-child { margin-right: 0; }
#Navbar ul li a {
/*	text-align: center;*/
	font-weight: bold;
	width: 100px;
	height: 100px;
	margin: 0 auto;
	display: table-cell;
	vertical-align: middle;
	line-height: 1.36rem;
}
    img.staff-img{
        width: 25%;
        position: absolute;
        bottom: -20px;
        right:5vw;
    }
    .h4,h4{
        padding-top:20px;
    }
    img.car-img{
        width: 100%;
        height: 400px;
        object-fit: cover;
    }
    img.logo-img{
        width: 35%;
    }
    .positionbutton{
        position: absolute;
        top:40px;
        right: 3vw;
    }
    .container{
        max-width: 900px !important;
    }
    .half{
        height:100px;
    }
    .bg-lightblue {	background: #fff!important; }
    #sec3{
        background-color: #e9f2f4!important;
    }
    
    
    
    .top-logo-img{
        text-align: right;
        position: absolute;
        right: 30px;
        top: 17px;
        width: 30%;
        position: fixed;
        z-index: 3;
    }
}/* END */

/* 極小デバイス（縦向きモバイル, 576px 未満）
============================================== */
@media screen and (max-width: 575.98px) {
#Navbar ul li a {
	font-weight: bold;
	color: #fff !important;
}
    .pt-5, .py-5{
/*        padding-top:0 !important;*/
    }
.catch-copy {
    margin: 0 10px;
    font-weight: bold;
    text-align: center;
    color: #fff;
    padding-top: 250px;
    text-shadow: 3px 0px 2px #333, 0px 3px 2px #333, -1px 0px 2px #333, 0px -1px 2px #333;
    font-size: 7vw !important;
    font-family: monospace;
    line-height: 60px;
    position: absolute;
/*    bottom:210px;*/
    bottom:66%;
    right:12%;
    padding-left:10px;
}

/*    TOPページ画像*/
    .main_img{
        width: 100%;
        max-width: 100%;
        margin:50px 0;
/*        text-align: center*/
    }
    .main_img img{
        width: 100%;
    }
    
    
/*    テーブル設定*/
    .table td, .table th{
        padding:5px;
        font-size:10px;
        line-height:13px;
    }
    
    
    iframe{
        max-width: 100%;
    }
    .h4,h4{
        font-size:15px;
        line-height:30px;
/*        padding-top:20px;*/
    }
    
    .header-bg{
        background-color: rgba(161,206,255,0.7);
        height: 80px;
    }
    
    img.staff-img{
        width: 55%;
        position: absolute;
        bottom: -30px;
        right:2vw;
    }
    img.car-img{
        width: 100%;
        height: 200px;
        object-fit: cover;
    }
    .col-md-4.py-3{
        text-align: center;
    }
    .col-md-4.py-3 img{
        max-width: 60%;
    }
    img.logo-img{
        width: 90%;
    }
    .positionbutton{
        position: absolute;
        top:20px;
        right: 3vw;
    }
    .btn04{
        width: 140px;
        font-size:15px;
        padding:12px;
    }
    .half{
        border-top-left-radius: 60% 120px;
        border-top-right-radius: 60% 120px;
    }
    .pb-5, .py-5{
        padding-bottom:2vw!important;
    }
    .mb-4, .my-4{
        margin-bottom:0px!important;
    }
    .slider__img{
        max-width: 100%;
        min-width: 100%;
        height:720px;
        object-fit: cover
        
    }
    
    .top-logo-img {
        text-align: right;
        position: absolute;
        right: 20px;
        top: 13px;
        width: 75%;
        position: fixed;
        z-index: 3;
    }
    
    header .container-fluid{
        height:950px;
        width: 100%;
        background: url(../img/DSC_03212.jpg);
        background-position: 50% -9%;
    }
    
    
/*    コピー画像設定*/
    img.copy-png{
        margin: 0 10px;
        padding-top: 250px;
        position: absolute;
        bottom:56%;
        right:3%;
        padding-left:10px;
        width:90%;
    }
    
    .fleecall{
        width:7vw;
    }
    
/*    スライド設定*/
    .slideContents section img{
        height: 700px;
        object-fit: cover;
    }
    .slideContents section#slide1 img{
        object-position: 10% 100%;
    }
    .slideContents section#slide2 img{
        object-position: right;
    }
    
    
    
    
    
/*    ボタン設定*/
    div.button-nav{
        position: absolute;
        bottom:0px;
        text-align: center;
        background-color: white;
        width:100%;
        height:150px;
    }

    div.button-nav ul{
        display:flex;
        padding: 0;
        margin-bottom:15px;
    }
    li.button{
        font-size: 4.5vw;
        /*    background-color: #482625;*/
        border: 1.5px solid #482625;
        padding: 15px 20px;
        list-style: none;
        color:#482625;
        width: 50%;
        margin:8px;
    }
    .call-button{
        background-color: #056bb5;
        padding: 20px 100px;
        font-size: 4.5vw;
        color:white !important;
    }
    
}/* END */