/*
Theme Name: sstourtheme
Author: itplnning
Description: SSツアー株式会社様専用のthemeです。
Version: 1.0
Text Domain: sstourtheme
*/

/* 汎用 ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━*/
.cmnTbl a {
    display: block;
    height: 100%;
    width: 100%;
}

.pc-hidden{
	display:none;  /*パソコンで非表示*/
}
.pc-open{
	display:inline;/*パソコンで表示*/
}

#sns{
	display:none;
}

.entry__content{
	min-height:500px;
}


.entry-header{
	background-image: url("./images/headerbg.png");
	height:260px;
	align-items: center;
	display: flex;
    background-size: cover;
}

@media (max-width: 768px){
	.entry-header {
	    background-size: cover;
	    background-position: center;
	    height: 260px;
	}
}

.breadcrumb{
	width:80%;
	margin:0 auto;
	padding-top:2rem;
}


/* coming-soon ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━*/
.coming-soon {
    background-color: #FFF4E5;   /* 薄いオレンジ背景 */
    border: 1px solid #FFC107;   /* 枠線 */
    padding: 15px 20px;
    border-radius: 8px;
    text-align: center;          /* 中央揃え */
    font-size: 16px;
    color: #333;
    font-weight: bold;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    max-width: 500px;
    margin: 20px auto;
    margin-top:50px;
    margin-bottom:50px;
}

.page-template-page-junbichu .header__nav .current-menu-item a{
	border-bottom: none;
}

/* TOP ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━*/
.front__main-visual-wrap {
    /* height: 700px; */
    aspect-ratio: 1920 / 1200;
    position: relative;
}

/*.front__main-visual-text {
    color: white;
    font-size: 4rem;
    font-weight: bold;
    left: 50%;
    position: absolute;
    text-align: center;
    top: 50%;
    /* transform: translate(-50%, -50%); */
    /*transform: translate(-50%, -100%);
    text-shadow: 1px 1px 3px var(--color-black);
    width: 80%;
}
.front__main-visual-wrap img {
    height: 100%;
    object-fit: cover;
    width: 100%;
}
*/

.n2-ss-text{
    font-size: 4rem !important;
    font-weight: bold !important;
    text-shadow: 1px 1px 3px var(--color-black) !important;
}


/* VK Blockのスライダー高さを自動に */
.vk-block-slider .vk-slide {
    height: auto !important;
}

/* section1------------------------------------ */
.front-features {
    margin: 5rem auto;
}
.front-features__contents {
    display: flex;
    gap: 5rem;
    margin: 5rem auto;
}

@media (min-width: 1090px) and (max-width: 1242px) {
   .front-features__contents {
	 gap: 1.0rem;
    }
}

@media (min-width: 1100px) and (max-width: 1163px) {
	.front-features__explanation h3 {
		    font-size: 1.5rem !important;
	}
}

.front-features__explanation {
    flex: 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.front-features__explanation h3{
    font-size: 1.7rem;
    font-weight: 800;
    margin-bottom:0px;/*add20260218*/
}
.front-features__explanation p{
    font-size: 1.0rem;
}
.front-features__img-wrap {
    flex: 1;
}
.front-features__img-wrap--clip img {
    object-position: left;
}

/* section2------------------------------------ */
.front-sns {
    background-color: var(--color-light-blue);
    padding-bottom: var(--section-padding);
    padding-top: var(--section-padding);
    width: 100%;
}
.front-sns__contents {
    display: flex;
    gap: 5rem;
    justify-content: center;
}
.front-sns__img-wrap {
    height: 500px;
    width: 500px;
}
.front-sns__img-wrap figure{
	width:100%;
	height:100%;
}
.front-sns__img-wrap img {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

/* section3------------------------------------ */
.front-news {
    background-color: lightgray;
    padding-bottom: var(--section-padding);
    padding-top: var(--section-padding);
}
.front-news__contents {
    background-color: white;
    border-radius: 20px;
    padding: 1rem 3rem;
}
.front-news__contents h2 {
    border-bottom: 1px solid var(--color-black);
    color: var(--color-black);
    font-size: 1.6rem;
    margin-bottom: 1rem;
    padding-bottom: .5rem;
    text-align: left;
    width: 100%;
}
.front-news__table {
    border-collapse: separate;
    border-spacing: 1rem 1rem;
    width: 100%;
}
.front-news__table tr td:nth-child(1) {
    width: 10em;
}



/* お知らせ一覧 ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━*/
/* TODO: 仮スタイル */
.news__content-wrapper {
    width: 90%;
    max-width: 1200px;
    margin: auto;
}

.news__item {
    display: flex;
    justify-content: left;
    gap: 5%;
    margin: 1rem 0;
    border-bottom: 1px dotted var(--color-black);
}

.news__item-link {
    color: var(--color-blue);
}

.news__item-link:hover {
    text-decoration: underline;
}


/* index.php ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━*/
.entry__container {
    width: 90%;
    max-width: 1200px;
    margin: auto;
}

.entry__datetime {
    text-align: left;
}

/* 会社概要━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━*/

.description__container{
    max-width: 900px;
    margin: 0 auto;  
    padding: 0 20px; 
}

.description{
	line-height: 1.5;
}

/*代表取締役の装飾*/
.daihyo{
    text-align:right;
    font-weight:600;
    letter-spacing:0.15em;
}

.position{
    margin-right:1.0em;
}

.person{
    font-size:1.3rem;
}

.shippori-mincho-regular {
  font-family: "Zen Old Mincho", serif;
  font-weight: 600;
  font-style: normal;
}

/*基本情報*/
.info__container{
	background:#EEEEEE;
	width:100%;
}

.info__inr_container{
    max-width: 1300px;
    margin-inline: auto;
    padding-inline: clamp(16px, 4vw, 48px);
}

.service-cell span::before {
    content: "●";          /* 文頭マーク */
    color: #023C72;        /* 好きな色 */
    margin-right: 2px;
    font-weight: bold;
}

/*業務案内*/
.service__container{
    max-width: 1300px;
    margin-inline: auto;
    padding-inline: clamp(16px, 4vw, 48px);
    margin: 0 auto;
}

.service__box-wrap{
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 45px;
}

.service__box{
    background: #009CE1;
    padding: 30px;
    box-sizing: border-box;
    border-radius: 16px;
    color:#FFF;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-size: clamp(1.4rem, 1.2vw, 2.2rem);
    font-weight: 700;
    height:100px;
    width: 100%;
    max-width: 300px;
    margin-inline: auto;
}

@media (max-width: 768px){
    .service__box-wrap{
        grid-template-columns: 1fr; /* 1列 */
        gap: 20px;
    }
}

/*車両案内*/
.whitespace_adjustment{
	margin-bottom:20px !important; 
}

.image-list{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:24px;
}

.image-card{
    position:relative;
    overflow:hidden;
    aspect-ratio: 16 / 10;
}

.image-card img{
    width:100%;
    height:100%;
    /*object-fit:cover;*/
    display:block;
}

/* 左上ラベル */
.image-card__label{
    position:absolute;
    top:0;
    left:0;
    background:#023C72;
    color:#fff;
    padding:0 18px;
    font-size:10px;
    font-weight:700;
    letter-spacing:.05em;
    z-index:2;
    display:flex;
    align-items:center;
	justify-content:center;
    width:150px;
    height:27px;
    font-size:12px;
}

/* グリッドの子をラップ */
.image-item{
    display:flex;
    flex-direction:column;
}

.image-card__text_midashi{
	color:#023C72;
	font-weight:bold;
}

.text__explanation{
	margin-left:1em;
	font-size:14px;
}

.image-card__text{
    margin-top:10px;
    font-size:14px;
}

.information_delimiter{
	border-top:1px solid;
}

.vehicle_pr{
	color:#023C72;
	font-weight:bold;
	font-size: 1.5rem;
}

.image-hosoku-text{
	padding-top:0px;
    padding-bottom: 15px;
}

@media (max-width: 768px){
	.image-list{
		display:block;
	}
	
	.image-item{
		margin-top:20px;
	}

	.text__explanation{
		margin-left:0em !important;
	}
}

/* お問合せ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━*/

/*メールフォームプロのデフォルトCSSをリセット*/
form#mailformpro label.mfp_checked {
    border: none !important;
    background-color: #FFF!important;
    box-shadow:none!important;
}

form#mailformpro label.mfp_not_checked {
    border: none !important;
}
/*ここまで*/

.page-id-15 .has-text-align-center{
	padding-bottom:50px;
}

/* フォーム全体のラベル幅用のスタイル */
.item_name {
    width: 230px;
    display: inline-block;
    margin-right: 10px;
    font-weight: bold;
}

.page-id-15 .service__container .form-group {
    display: flex;
    align-items: flex-start;
    margin-bottom: 15px;
}

.chk{
	width:auto;
}

/*input*/
.page-id-15 .service__container .form-group input{
    flex: 0 1 450px;  /* 基本幅 450px*/
    max-width: 450px;
    height: 32px;
    border: none;
    background-color: #EDEDED;
    padding: 2px 6px;
    box-sizing: border-box;
    font-size: 14px;
    box-shadow: none;
    border-radius: 0px;
    margin-left:20px;
    margin-top:0px;
}

/*textarea*/
.page-id-15 .service__container .form-group textarea {
    height: 250px !important;
	width:98%  !important;
    border: none;
    background-color: #EDEDED;
    padding: 2px 6px;
    box-sizing: border-box;
    font-size: 14px;
    box-shadow: none;
    border-radius: 0px;
    margin-left:20px;
    margin-top:0px;
}

.input-wrap{
	width:100%;
}

.required{
	width:52px;
	background:#C31D44;
	color:#FFF;
	padding:5px;
	text-align:center;
}

.no_required{

}

.wd450{
	width:450px;
}

.mfp_err{
    padding:0px !important;
    margin-left:1.2em!important;
    margin-top:0px !important;
    color: #F00;
    line-height: normal;
    background-image: none!important;
    background-repeat: no-repeat!important;
    font-size: 16px !important;
}

.example{
	margin-left:1.2em;
}

/*ボタン*/
.mfp_element_submit, .mfp_element_reset, .mfp_element_button, button.mfp_next, button.mfp_prev{
	background:#000 !important;
	color:#fff !important;
	border-radius: 0px !important;
	text-shadow: none !important;
	padding:10px !important;
	font-weight:bold;
}

.mfp_element_submit:hover, .mfp_element_reset:hover, .mfp_element_button:hover, button.mfp_next:hover, button.mfp_prev:hover {
    background: none !important;
    box-shadow: none !important;
    color:#000 !important;
}

/*確認画面*/
.page-id-15 h6{
	text-align:center;
    font-size: 1.5rem;
    margin-top: 10px;
    margin-bottom: 40px;
}

table#mfp_confirm_table tr th, table#mfp_confirm_table tr td {
	font-size: 16px !important;
}

table#mfp_confirm_table tr th {
	width:230px !important;
}

.mfp_colored{
	background:#FFF !important;;
}

table#mfp_confirm_table {
    max-width: 1000px !important;;
    width: 100% !important;;
    margin: 0 auto !important;;
}

div.mfp_buttons button#mfp_button_cancel {
    background: #b5b5b5 !important;
    color:#fff !important;
}

/*disabled*/
input:disabled,
textarea:disabled,
select:disabled {
    background-color: #d5d5d5 !important;
    color: #999;
    border: 1px solid #ccc;
    cursor: not-allowed;

   /* ★ iOS対策ここから */
    -webkit-appearance: none;
    appearance: none;
    opacity: 1; /* Safariはdisabledを半透明にする */

}

/*thanks*/
.form-complete {
    background-color: #E0F7FA;  /* 薄い水色背景 */
    border: 1px solid #00BCD4; /* 枠線 */
    color: #007C91;            /* 文字色 */
    padding: 20px 25px;
    border-radius: 8px;        /* 角丸 */
    text-align: center;
    font-size: 18px;
    font-weight: bold;
    max-width: 500px;
    margin: 30px auto;         /* 中央に配置 */
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

.form-complete p{
	margin:0px;
}

/* --- レスポンシブ --- */

@media (max-width: 800px){
    table#mfp_confirm_table tr th {
		width:100% !important;
    }

    .form-group {
        flex-direction: column; /* ラベルの上に入力欄を置く */
        align-items: stretch;
    }

    .item_name {
        width: auto;
    }

    .required, .no_required {
        width: auto;
        margin-bottom: 5px;
    }

	.no_required::after {
	    content: "";
	    display: block
	    height: 0;
	}


    .input-wrap input,
    .input-wrap textarea,
    .input-wrap {
        width: 100% ;
    }

	.page-id-15 .service__container .form-group input[type="text"]{
		max-width:99%;
		width: 99%;
		margin-left:0px;
		margin-top:10px;
	}
	
	 .wd450{
		margin-top:10px !important;
	 }

	.page-id-15 .service__container .form-group input[type="radio"] {
		margin-left:0px;
	}
	
	.page-id-15 .service__container .form-group input {
		max-width: 99%;
		margin-left:0px;
	}

	.page-id-15 .service__container .form-group textarea {
		margin-left:0px;
		width:99%;
		margin-top:10px !important;
	}

	.page-id-15 .service__container .form-group {
		display:block;
	}

    .radio-group {
        flex-direction: column;
    }

	form#mailformpro label.mfp_checked{
		display:block;
	}

	form#mailformpro label.mfp_not_checked{
		display:block;
	}
    
    .wd450 , .radio-group, .example{
    	width:100%;
    }
    
    .example{
    	margin-left:0em;
    }
    
    .chk{
    	width:auto;
    }
    
    /*スマホのみ非表示*/
    .no_required_none {
        display: none;
    }
}

/*必須ラベルレイアウト崩れ防止*/
@media screen and (min-width: 768px) and (max-width: 1015px) {
	.required{
		padding:0px !important;
	}
}
