@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&display=swap');
@font-face {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: normal;
    font-style: normal;
}

html{
	scroll-behavior: smooth;	
}

* {
  box-sizing: border-box;
}

body {
   font-family: "Noto Sans JP", sans-serif;
    letter-spacing: .1em;
		line-height:1.9;
	background:#fff;
	width:100%;
 overflow-x: hidden;
}


body {
    font-family: "Noto Sans JP", "Yu Gothic", "Meiryo", sans-serif; /* 日本語フォント優先 */
}

body.lang-en { /* 英語用のフォント */
    font-family: "Roboto", "Helvetica Neue", Arial, sans-serif; /* 英語フォント優先 */
}


body, html {
    margin: 0;
    padding: 0;
    overflow-x: hidden; /* 横スクロールバーを非表示にする */
    width: 100%; /* 画面幅を超えないように設定 */
}

img{
		width: 100%;
    height: auto;
    vertical-align: middle;
}

.pc{display:block;}
.sp{display:none;}

header{
	position: fixed;
	width: 100%;
	z-index:999;
}

header .hdr_inr{
    display: flex;
    justify-content: space-between;
    max-width: 95%;
    margin: 0 auto;
    padding: 20px 0;
}



#menuBtn.btnvisivility{
	opacity:0;
}

.h_menu_wrap{
	background: #000;
    position: relative;
    border-radius: 50%;
    display: block;
    width: 50px;
    height: 50px;	
    padding: 13px;
    cursor: pointer;
		transition:.2s ease;
		animation-delay: .5s;
	max-width:100%;
}

#menuBtn span{
	width: 25px;
    display: block;
    background: #fff;
    height: 3px;
}

#menuBtn span:nth-child(2){
    margin: 7px 0px;	
}

#navWrrper {
    transition: transform 0.5s ease, visibility 0.5s ease;
    transform: translateX(100%);
    visibility: hidden;
}

.main_nav_wrap{
    position: fixed;
    width: 100%;
    background: rgba(999, 999, 999, 0.9);
    top: 0;
    height: 100vh;
    display: flex;
    justify-content: space-between;	
}

.main_nav_wrap .nav_link{
	position:relative;
	width:50%;
}

.main_nav_wrap .nav_link .n_left{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);	
}

.main_nav_wrap .nav_link .n_left .n_logo{
    max-width: 200px;
    margin: 0 auto;
    width: 100%;
}

.main_nav_wrap .nav_link .links{
    display: grid;
    gap: 20px;
    text-align: center;
}

.main_nav_wrap .nav_link .links .tel{
    max-width: 300px;
    margin: 50px auto 20px;
    display: block;	
}

.main_nav_wrap .nav_link .links .form, .main_nav_wrap .nav_link .links .line{
    color: #000;
    font-weight: bold;
    text-decoration: none;
    max-width: 550px;
    margin: 0 auto;
    width: 100%;
	border:solid 2px;
	padding:10px 0;
	border-radius:50px;
	font-size:14px;
    position: relative;
}

.main_nav_wrap .nav_link .links .form i:before, .main_nav_wrap .nav_link .links .line i:before{
    content: "";
    width: 20px;
    height: 20px;
    position: absolute;
    top: 50%;
    transform: translate(12px, -50%);
    left: 0;
    background-size: contain;
    background-repeat: no-repeat;
    display: block;
}

.main_nav_wrap .nav_link .links .form i:before{
	background-image:url(/wp-content/themes/original/assets/images/icon_form.png);
}

.main_nav_wrap .nav_link .links .line i:before{
	background-image:url(/wp-content/themes/original/assets/images/icon_line.png);
}

.main_nav_wrap .nav_link .links a.line:after,
.main_nav_wrap .nav_link .links a.form:after{
    content: "";
    background-image: url(/wp-content/themes/original/assets/images/link_arow.svg);
    background-size: contain;
    transition: .3s ease;
    width: 18px;
    height: 10px;
    display: block;
    right: 0;
    position: absolute;
    top: 50%;
    transform: translate(-10px, -50%);
    background-repeat: no-repeat;
}

.main_nav_wrap .nav_link .links a.line:hover:after,
.main_nav_wrap .nav_link .links a.form:hover:after{
    transform: translate(-5px, -50%);
}

.main_nav_wrap nav{
		width: 50%;
  	position: relative;	
}

.main_nav_wrap nav ul{
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(0%, -50%);
}

.main_nav_wrap nav ul li{
	margin:50px 0;
}

.main_nav_wrap nav ul li a{
	font-size:24px;
	text-decoration:none;
	color:#000;
}

.main_nav_wrap nav ul li a span:before{
    position: absolute;
    content: "";
    width: 2px;
    height: 22px;
    background: #000;
    display: block;
    top: 50%;
    left: 0;
    transform: translate(-16px, -50%);
}

.main_nav_wrap nav ul li a span{
	font-size:16px;
	display:inline-block;
	position:relative;	
	margin-left: 30px;	
	font-weight:bold;
}

.main_nav_wrap nav .close_btn{
    position: absolute;
    right: 50px;
    top: 50px;
    cursor: pointer;
		z-index: 999;	
}

.main_nav_wrap nav .close_btn span{
    width: 30px;
    height: 2px;
    display: block;
    background: #000;
		margin: 5px 0;
		transition: .5s ease;
	  animation-delay: .2s;
}

.main_nav_wrap nav .close_btn span:nth-child(1){
	transform: rotate(45deg) translate(2px, 1px);
}

.main_nav_wrap nav .close_btn span:nth-child(2){
    transform: rotate(-45deg) translate(3px, -3px);
}

.main_nav_wrap nav .close_btn:hover span:nth-child(1){
	transform: rotate(55deg) translate(1px, -1px);
}

.main_nav_wrap nav .close_btn:hover span:nth-child(2){
	transform: rotate(-55deg) translate(6px, -3px);
}



/* #mvセクションのスタイル */
#mv {
    position: relative; /* 親要素として相対位置を指定 */
    overflow: hidden; /* 必要に応じて要素のはみ出しを隠す */
    width: 100%; /* 幅を100%に指定 */
    height: 100vh; /* 画面の高さを100%に指定 */
    z-index: 1; /* 重なり順を調整 */
	background:#FEFEFE;
}

/* #mv内のラップ用スタイル */
#mv .mv_wrap {
    position: relative;
    height: 100vh; /* 全画面の高さ */
    width: 100%;
    overflow: hidden;
    z-index: 1; /* 背景画像など他の要素と重ならないように調整 */
}

/* .mv_slideのスタイル */
#mv .mv_slide {
    position: absolute;
    top: -10%;
    right: 0; /* 右側に配置 */
    width: 70%; /* 背景画像を右側に表示 */
    height: 100%;
    z-index: 0; /* 背景に表示 */
    background: url(/wp-content/themes/original/assets/images/topbg.png) no-repeat right center;
    background-size: cover; /* 背景画像を全体に表示 */
}


/* スライド内のコンテナスタイル */
#mv .mv_slide .swiper-container {
    width: 100%;
    height: 100%;
}

/* メインテキスト（mv_text）のスタイル */
#mv .mv_text {
    position: absolute;
    top: 40%; /* 上から50%の位置 */
    left: 50%; /* 左から50%の位置 */
    transform: translate(-50%, -50%); /* 中央に揃える */
    z-index: 2; /* 背景よりも前面に表示 */
    padding: 20px; /* 必要に応じて余白を調整 */
    display: block; /* インライン要素ではなくブロック要素に */
  
}

/* テキスト要素（h1, p）のスタイル */
.mv_text h1, .mv_text p {
    font-size: 24px; /* 全体のフォントサイズ */
    text-align: left; /* 各要素を左揃えに */
    width: auto; /* 自動幅に戻す */
    margin: 0; /* デフォルトの余白を削除 */
 
}

.mv_text h1 {
    font-size: 60px; /* 見出しのフォントサイズ */
    margin-bottom: 0px; /* 見出し下に余白を追加 */
    color: #0A2481;
	line-height:1.5em;
}

.mv_text p {
    font-size: 30px; /* 段落のフォントサイズ */
    color: #0A2481;
	line-height:1.5em;
	padding-top:10px;
}

/* mv_text内の画像スタイル */
#mv .mv_text picture {
    max-width: 40%;
    height: auto;
    display: block; /* インライン要素ではなくブロック要素に */
    margin: 0; /* デフォルトの余白を削除 */
    padding: 0; /* デフォルトの余白を削除 */
}

img.cta2 {
    max-width: 30%;
}

img.cta3 {
    max-width: 60%;
}

img.cta {
    max-width: 50%;
    height: auto; /* 高さを自動調整して比率を維持 */
    display: block; /* インライン要素をブロック要素に */
    margin: 0; /* 不要な余白を削除 */
    padding: 0; /* 不要な余白を削除 */
}

img.center{
	margin:0 auto;
	text-align:center;
}

@media screen and ( max-width:1980px ) {
	img.cta3 {
    max-width: 80%;
}
}

@media screen and ( max-width:1400px ) {
	img.cta3 {
    max-width: 100%;
}
}

/* 特定性を強化 */
#mv .mv_text img.cta {
    max-width: 40%;
    height: auto;
    display: block;
}

/* pictureタグのスタイル */
#mv picture {
    display: block;
    height: 100vh; /* 背景画像を全画面表示 */
    width: 100%;
}

#mv picture img {
    object-fit: cover; /* 画像が切れないようにカバー */
    width: 100%;
    height: 100%;
}

/* スクロールダウンアイコンのスタイル */
.scrolldown1 {
    position: absolute;
    left: 50%;
    bottom: 0;
    height: 50px;
    transform: translateX(-50%);
}

/* mv_slide内のpictureスタイル */
#mv .mv_slide picture {
    display: block;
    width: 100%;
    height: 100vh; /* 全画面の高さを設定 */
	
}

#mv .mv_slide img {
    object-fit: cover; /* 画像全体を親要素にフィットさせる */
    object-position: right center; /* 画像を右側、かつ高さ中央に表示 */
    width: 100%;
    height: 100%;
}


p.bluebg{
	background:#0A2481;
	color:#fff !important;
	display:inline-block;
	font-size:20px;
padding:10px;
	font-weight:bold;
	text-align:center;
	margin:0 auto;
	margin-top:20px;
	margin-bottom:20px;
}


.pc{
		display:block !important;;
	}
	
	.sp{
		display:none !important;;
	}

@media (max-width: 768px) {

	.pc{
		display:none !important;;
	}
	
	.sp{
		display:block !important;;
	}

    /* セクション全体の調整 */
    #mv {
        position: relative;
        overflow: hidden;
        width: 100%; /* 画面幅にフィットさせる */
        height: 100vh; /* ビューポートの高さにフィット */
        background: url(/wp-content/themes/original/assets/images/topbg.png) no-repeat center center;
        background-size: cover; /* 背景画像を全体に表示 */
        display: flex;
        align-items: center; /* 縦方向の中央揃え */
        justify-content: center; /* 横方向の中央揃え */
        text-align: center;
    }

    /* mv_wrapの調整 */
    #mv .mv_wrap {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 100%; /* 親要素の幅を画面いっぱいに */
        height: 100%; /* 親要素の高さを画面高さに合わせる */
        padding: 0;
        margin: 0;
    }

    /* innerの調整 */
    #mv .inner {
        display: flex;
        flex-direction: column;
        align-items: center; /* 横方向に中央揃え */
        justify-content: center; /* 縦方向に中央揃え */
        width: 100%; /* 横幅を100%に設定 */
        height: 100%; /* 高さを100%に設定 */
        padding: 0;
        margin: 0;
    }

    /* mv_text の横幅と位置調整 */
   #mv .mv_text {
        /*position: relative; 
        top: 5%; */
        width: 100%;
        max-width: 800px;
        margin: 0 auto;
        padding: 0px;
        background-color: rgba(255, 255, 255, 0.5); /* 背景に白色の半透明を追加 */
        border-radius: 8px;
        text-align: center;
        box-sizing: border-box; /* パディングを含めた幅を計算 */
    }
    /* テキスト内の画像 */
    #mv .mv_text img {
        max-width: 100%; /* 画像が要素幅いっぱいに広がるように設定 */
        height: auto;
    }

    /* テキスト要素のスタイリング */
    #mv .mv_text p,
    #mv .mv_text h1 {
        margin: 0px 0;
        font-size: 1.2em;
        line-height: 1.5;
        color: #0A2481;
        text-align: center; /* テキストを中央揃え */
		font-weight: bold;
    }

    #mv .mv_text h1 {
        font-size: 2em;
        font-weight: bold;
    }
	
	#mv .mv_text p.bluebg{
	background:#0A2481;
	color:#fff !important;
	display:inline-block;
	font-size:17px;
padding:15px;
	font-weight:bold;
	text-align:center;
	margin:0 auto;
	margin-top:20px;
	margin-bottom:20px;
}


    /* スライド背景の調整 */
    #mv .mv_slide {
        display: none; /* 背景画像を全体に表示するので、スライドは非表示 */
    }
}

/* デフォルトでは br.sponly を非表示にする */
br.sponly {
    display: none; /* デスクトップやタブレットでは非表示 */
}

/* スマホ用の表示スタイル */
@media (max-width: 768px) {
    br.sponly {
        display: block; /* スマホでは表示 */
    }
}


.release-announcement {
    color: #333; /* 通常のテキストはダークグレー */
    font-size: 2em; /* 大きな文字サイズ */
    font-weight: bold; /* 太字 */
    text-align: left; /* 左揃え */
    padding: 15px; /* 上下左右にスペースを追加 */
    border: 3px solid #E50C45; /* 赤いボーダー */
    border-radius: 10px; /* 角を丸める */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* 軽い影を追加 */
    margin: 10px 0; /* 上下に余白 */
    display: inline-block; /* コンテンツの幅に合わせる */
}

.release-announcement .highlight {
    color: #E50C45; /* 数値部分を目立つ赤色に */
    font-size: 1em; /* 通常テキストのサイズに設定 */

    padding: 5px; /* 数値部分だけに余白を追加 */
    border-radius: 5px; /* 数値部分の角を少し丸める */
}

.release-announcement .highlight .big-number {
    font-size: 2.5em; /* 11と1をさらに大きく */
    color: #E50C45; /* 赤いテキストで目立たせる */
}

/* スマホ用のメディアクエリ */
@media screen and (max-width: 768px) {
    .release-announcement {
        font-size: 1.5em; /* スマホ用に文字サイズを少し小さく */
		 margin: 0px 0; /* 上下に余白 */
		line-height:0;
		 padding: 0px 10px;
		padding-bottom:10px;
    }
	
	.release-announcement p{
				 margin: 0px 0; /* 上下に余白 */
		line-height:0;
	}

    .release-announcement .highlight {
        font-size: 0.8em; /* 通常のテキストサイズも調整 */
    }

    .release-announcement .highlight .big-number {
        font-size: 2em; /* 大きな数字も少し小さめに調整 */
    }
}


.cando{
	margin-top: -100px;
	margin-bottom: -100px;
	
}

/* CTAボックスのスタイル */
.ctabox {
    position: relative; /* 相対位置を指定 */
    margin-top: -300px; /* 上に移動して#mvと重なるように調整 */
    z-index: 5; /* #mvよりも手前に表示 */
    width: 100%; /* コンテンツ幅を100%に設定 */
    display: flex; /* フレックスボックスを使用 */
    justify-content: center; /* コンテンツを中央に配置 */
    align-items: center; /* 垂直方向に中央揃え */
}

/* 左側に配置する .background-section のスタイル */
.background-section {
    position: relative;
    width: 100%; /* 全幅を占める */
    height: 150px; /* 高さを指定（必要に応じて調整） */
    background-image: url('/wp-content/themes/original/assets/images/sitebg.png'); /* 左側の背景画像 */
    background-repeat: no-repeat; /* 画像を繰り返さない */
    background-position: left center; /* 画像を左中央に配置 */
    background-size: contain; /* 画像のサイズを親要素にフィット */
    margin: 30px 0; /* 上下に余白を追加 */
}

/* 右側に配置する .background-section2 のスタイル */
.background-section2 {
    position: relative;
    width: 100%; /* 全幅を占める */
    height: 150px; /* 高さを指定（必要に応じて調整） */
    background-image: url('/wp-content/themes/original/assets/images/sitebg.png'); /* 右側の背景画像 */
    background-repeat: no-repeat; /* 画像を繰り返さない */
    background-position: right center; /* 画像を右中央に配置 */
    background-size: contain; /* 画像のサイズを親要素にフィット */
    margin: 30px 0; /* 上下に余白を追加 */
}


/* ctabox2 のスタイル */
.ctabox2 {
    position: relative; /* 親要素内での相対位置を指定 */
    background-color: #E8E8F3; /* 背景色を設定 */
    width: 100vw; /* ビューポート全体の幅を指定 */
  
    padding: 40px 20px; /* 内側の余白を設定 */
    margin: 0; /* 上下左右の余白を削除 */
    box-sizing: border-box; /* パディングとボーダーを含めてボックスサイズを計算 */
    /* 左上と右下に背景画像を表示 */
    background-image: 
        url('/wp-content/themes/original/assets/images/sitebg.png'), /* 左上の背景画像 */
        url('/wp-content/themes/original/assets/images/sitebg.png'); /* 右下の背景画像 */
    background-position: left top, right bottom; /* 画像を左上と右下に配置 */
    background-repeat: no-repeat, no-repeat; /* 画像を繰り返さない */
    background-size: 250px, 250px; /* それぞれの背景画像のサイズを設定 */
    z-index: 1; /* z-indexを指定 */
}

/* レスポンシブ対応のスタイル */
@media (max-width: 768px) {
    .ctabox2 {
        background-position: center top, center bottom; /* 背景画像を上下中央に配置 */
        background-size: 100px, 100px; /* 画像のサイズを調整 */
    }
}


/* 左側に配置する .background-section のスタイル */
.background-sectionb {
    position: relative;
    width: 100%; /* 全幅を占める */
    height: 200px; /* 高さを指定（必要に応じて調整） */
    background-image: url('/wp-content/themes/original/assets/images/sitebg.png'); /* 左側の背景画像 */
    background-repeat: no-repeat; /* 画像を繰り返さない */
    background-position: left center; /* 画像を左中央に配置 */
    background-size: contain; /* 画像のサイズを親要素にフィット */
    margin: 30px 0; /* 上下に余白を追加 */
}

/* 右側に配置する .background-section2 のスタイル */
.background-section2b {
    position: relative;
    width: 100%; /* 全幅を占める */
    height: 200px; /* 高さを指定（必要に応じて調整） */
    background-image: url('/wp-content/themes/original/assets/images/sitebg.png'); /* 右側の背景画像 */
    background-repeat: no-repeat; /* 画像を繰り返さない */
    background-position: right center; /* 画像を右中央に配置 */
    background-size: contain; /* 画像のサイズを親要素にフィット */
    margin: 30px 0; /* 上下に余白を追加 */
}




/* サイトの背景を左と右に超えるように調整する場合（オプション） */
.background-section::before, .background-section2::before {
    content: '';
    position: absolute;
    top: 0;
    width: 150px; /* 背景画像の幅を指定 */
    height: 100%; /* 背景画像の高さを指定 */
    background-repeat: no-repeat;
    background-size: contain;
    z-index: -1; /* 背景として表示されるように設定 */
}


/* ctabox内のコンテンツラッパーのスタイル */
.inner2 {
    max-width: 1000px !important;
    margin: 0 auto;
    padding: 0 20px;
    z-index: 2; /* 重なり順を設定 */
}


.ctaimg{
width:60%;
margin:0 auto;
	display:block;
	text-align:center;
}


@media (max-width: 768px) {
	
	
	.ctaimg{
width:100%;
margin:0 auto;
	display:block;
	text-align:center;
}

	
	.inner2 {
    max-width: 1000px !important;
    margin: 0 auto;
    padding: 0 0px;
    z-index: 2; /* 重なり順を設定 */
}
}

.servicebox {
    display: flex; /* フレックスボックスを使用して横並びにする */
    justify-content: space-between; /* 画像間のスペースを均等に配置 */
    align-items: center; /* 垂直方向に中央揃え */
    flex-wrap: wrap; /* 必要に応じて改行されるようにする */
    margin: 20px 0; /* 上下に余白を追加 */
    padding: 0 20px; /* 左右に余白を追加 */
}

.servicebox img {
    width: 22%; /* 各画像の幅を指定（合計100%未満になるように） */
    height: auto; /* 自動的に高さを調整 */
    margin: 10px; /* 各画像の周りに余白を追加 */
    box-sizing: border-box; /* 画像の余白を含めてサイズを計算 */
    transition: transform 0.3s; /* ホバー時のアニメーションを設定 */
}

.servicebox img:hover {
    transform: scale(1.05); /* ホバー時に少し拡大する */
}

/* スマホ表示（768px 以下）の場合の .servicebox スタイル */
@media (max-width: 768px) {
    .servicebox {
        justify-content: center; /* 画像を中央揃えにする */
    }
    
    .servicebox img {
        width: 49%; /* 画像の幅を50%に設定（2列） */
        margin: 0px; /* 各画像の間隔を狭める */
    }
}



.title-container {
    display: flex; /* フレックスボックスを使用 */
    justify-content: center; /* コンテンツを中央に配置 */
    align-items: center; /* 垂直方向に中央揃え */
    height: 200px; /* 高さを指定 */
    width: 100%; /* 幅を指定 */
    margin: 0 auto; /* 左右中央揃え */
    text-align: center; /* テキストを中央揃え */
}

/* 左側の背景画像を設定するためのスタイル */
.title-icon {
    width: 50px; /* 背景画像の横幅 */
    height: 85px; /* 背景画像の高さ */
    background-image: url('/wp-content/themes/original/assets/images/titleicon.png'); /* 画像を背景に設定 */
    background-repeat: no-repeat; /* 画像を繰り返さない */
    background-position: center; /* 中央に配置 */
    background-size: cover; /* 画像をコンテナ内にフィットさせる */
    margin-right: 20px; /* テキストと画像の間隔 */
}

/* テキスト部分のスタイル */
.title-text {
    display: flex;
    flex-direction: column;
    align-items: flex-start; /* テキストを画像の右側に揃える */
}

.title-text h2 {
    font-size: 1.8rem; /* メイン見出しのサイズ */
    color: #2a4b9b; /* メイン見出しの色 */
    margin: 0; /* 余白をなくす */
    font-weight: bold;
}

.title-text .subtitle {
    font-size: 1rem; /* サブ見出しのサイズ */
    color: #666; /* サブ見出しの色 */
    margin: 5px 0 0 0; /* 上に少し余白を入れる */
}

.title-text h1 {
    font-size: 2.2rem; /* メイン見出しのサイズ */
    color: #2a4b9b; /* メイン見出しの色 */
    margin: 0; /* 余白をなくす */
    font-weight: bold;
	
}



/* タイトル全体のスタイル */
.title-container-right {
    display: flex; /* フレックスボックスを使用してレイアウト */
    justify-content: center; /* 横方向に中央揃え */
    align-items: center; /* 垂直方向に中央揃え */
    height: 200px; /* 高さを指定 */
    width: 100%; /* 幅を100%に設定 */
    max-width: 1200px; /* 必要に応じて最大幅を設定（例: 1200px） */
    margin: 0 auto; /* 左右中央揃え */
    padding: 0; /* 内側の余白を削除 */
    text-align: center; /* テキストを中央揃え */
}

/* テキスト部分のスタイル */
.title-text-right {
    display: flex;
    flex-direction: column;
    align-items: center; /* テキストを中央に配置 */
    justify-content: center; /* 垂直方向の中央揃え */
    margin: 0; /* 余白を削除 */
    padding: 0; /* 余白を削除 */
    text-align: center; /* テキストを中央に表示 */
    z-index: 10; /* 背景画像より前面に表示 */
}

/* メイン見出しのスタイル */
.title-text-right h2 {
    font-size: 1.8rem; /* メイン見出しのサイズ */
    color: #2a4b9b; /* メイン見出しの色 */
    margin: 0; /* 余白を削除 */
    font-weight: bold;
    text-align: center; /* 見出しを中央揃えに */
}

/* サブ見出しのスタイル */
.title-text-right .subtitle {
    font-size: 1rem; /* サブ見出しのサイズ */
    color: #666; /* サブ見出しの色 */
    margin: 5px 0 0 0; /* 上に少し余白を入れる */
    text-align: center; /* サブ見出しを中央揃えに */
}

/* 左側のアイコンスタイル（必要に応じてサイズを調整） */
.title-icon {
    width: 50px; /* 画像の横幅 */
    height: 85px; /* 画像の高さ */
    background-image: url('/wp-content/themes/original/assets/images/titleicon.png'); /* 左側に配置する画像を指定 */
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    margin-right: 20px; /* テキストとの間隔を最小限に調整 */
}

/* 右側に配置する背景画像スタイル */
.title-icon-right {
    width: 400px; /* 右側アイコンの横幅を調整 */
    height: 300px; /* 高さを自動調整 */
    background-image: url('/wp-content/themes/original/assets/images/titleimg.png'); /* 右側に配置する画像を指定 */
    background-repeat: no-repeat; /* 画像を繰り返さない */
    background-position: center; /* 画像を中央に配置 */
    background-size: contain; /* 画像の比率を保ちながら縮小 */
    margin-left: 20px; /* テキストとの余白を調整 */
    padding: 0; /* 余白を削除 */
    display: block; /* 表示を確実にするために block 指定 */
    z-index: 5; /* z-index を調整して消えないように */
}

/* タイトルとアイコンの余白調整 */
.title-container-right .title-icon-right {
    margin-left: 0; /* 左側の余白を削除 */
}

/* 親要素のスタイルを調整して中央配置を強調 */
.title-container {
    width: 100%; /* 幅を100%に設定 */
    max-width: 1200px; /* 必要に応じて最大幅を設定（例: 1200px） */
    margin: 0 auto; /* 左右中央揃え */
    padding: 0; /* 内側の余白を削除 */
    display: flex; /* フレックスボックスを使用してレイアウト */
    justify-content: center; /* 横方向に中央揃え */
    align-items: center; /* 垂直方向に中央揃え */
    text-align: center; /* テキストを中央揃え */
}



.exam {
    background: #E8E8F3; /* 背景色を設定 */
    padding-top: 70px; /* 上部の余白を設定 */
    padding-bottom: 500px; /* 下部の余白を追加して背景画像を見やすく */
    position: relative; /* 背景画像を制御するために position を設定 */
    z-index: 1; /* 親要素のz-indexを1に設定 */
}

/* 背景画像用のコンテナを設定 */
.bg-image-container {
    position: absolute; /* 親要素内で絶対配置 */
    bottom: 0; /* 画面の下部に配置 */
    left: 53%; /* 左右中央に配置 */
    transform: translateX(-50%); /* 中央揃えのために X 軸方向に移動 */
    width: 100%; /* コンテナの幅を100%に設定 */
    height: auto; /* 高さは自動調整 */
    display: flex; /* フレックスボックスで中央揃え */
    justify-content: center; /* 横方向に中央揃え */
    text-align: center; /* 画像を中央揃え */
    pointer-events: none; /* 背景画像として動作するためクリックを無効化 */
    z-index: -1; /* 背景画像を下に配置（負の値） */
}

/* 背景画像用の img タグを設定 */
.bg-image {
    width: 1300px; /* 必要に応じて画像の幅を調整 */
    height: auto; /* 高さは自動調整 */
    max-width: 100%; /* 親要素の幅を超えないように設定 */
    display: block; /* 画像をブロック要素として表示 */
    margin: 0 auto; /* 左右中央揃え */
    opacity: 0.8; /* 必要に応じて透明度を調整 */
    position: relative; /* 画像を相対配置にして調整しやすく */
}

/* メイン画像（背景画像の上に表示する画像）用の設定 */
.exam .inner img {
    position: relative; /* 親要素に対して相対配置 */
    z-index: 2; /* 背景画像より前面に表示 */
    width: 100%; /* 画像の幅を調整（必要に応じて変更） */
 
    height: auto; /* 高さは自動調整 */
    margin: 0 auto; /* 左右中央揃え */
    display: block; /* 画像をブロック要素として表示 */
}







/* .inner コンテナのスタイル */
features .inner {
    display: flex; /* フレックスボックスを使用して要素を配置 */
    flex-wrap: wrap; /* 要素を複数行に表示 */
    justify-content: space-between; /* 各ボックスの間に余白を追加 */
    gap: 20px; /* 各 .featuresbox 間の間隔を設定 */
}

/* .featuresbox のスタイル設定 */
.featuresbox {
    display: flex; /* フレックスボックスを使用して内部を左右に配置 */
    align-items: center; /* 垂直方向に中央揃え */
    width: 100%; /* ボックスの幅を100%に設定 */
    max-width: 1200px; /* 必要に応じて最大幅を設定（例: 1000px） */
    margin: 0 auto; /* 左右中央揃え */
    padding: 20px; /* 内側の余白を設定 */
    background-color: #ffffff; /* 背景色を設定（必要に応じて） */
    
    border-radius: 8px; /* 角を丸くする */
    gap: 20px; /* 画像とテキストの間隔を設定 */
}

/* 左側の画像のスタイル */
.featuresbox img {
    width: 380px; /* 画像の幅を設定（必要に応じて変更） */
    height: auto; /* 高さは自動調整 */
    border-radius: 8px; /* 画像の角を丸くする */
    flex-shrink: 0; /* 画像のサイズを維持する */
}

/* 右側のテキスト部分のスタイル */
.featuresbox h3, .featuresbox p {
    margin: 0; /* デフォルトのマージンを削除 */
}

.featuresbox h3 {
    font-size: 1.4rem; /* 見出しのフォントサイズを設定 */
    color: #2a4b9b; /* 見出しの色を設定 */
    margin-bottom: 10px; /* 見出し下の余白を設定 */
	font-weight:bold;
}

.featuresbox p {
    font-size: 1rem; /* 段落のフォントサイズを設定 */
    color: #666666; /* 段落の色を設定 */
}

/* レスポンシブ対応のスタイル */
@media (max-width: 768px) {
    .featuresbox {
        flex-direction: column; /* スマホサイズでは上下に並べる */
        align-items: flex-start; /* テキストを左揃え */
        text-align: left; /* テキストを左揃え */
    }

    .featuresbox img {
        width: 100%; /* 画像の幅を100%に設定して親要素にフィット */
        margin-bottom: 10px; /* テキストとの余白を設定 */
    }
}

/* スマホ表示（768px 以下）の場合 */
@media (max-width: 768px) {
    .featuresbox {
        flex-direction: column-reverse; /* 子要素の表示順を逆にする */
        text-align: center; /* テキストを中央揃えに変更（必要に応じて） */
    }

    /* 画像部分のスタイル調整 */
    .features-image {
        margin-bottom: 20px; /* テキストとの間に余白を追加 */
    }
}

@media (max-width: 768px) {
	
	.title-text-right h2 {
    font-size: 1.5rem; /* メイン見出しのサイズ */
    color: #2a4b9b; /* メイン見出しの色 */
    margin: 0; /* 余白を削除 */
    font-weight: bold;
    text-align: center; /* 見出しを中央揃えに */
}
	
	.title-icon-right {
    width: 300px; /* 右側アイコンの横幅を調整 */
    height: 200px; /* 高さを自動調整 */
    background-image: url('/wp-content/themes/original/assets/images/titleimg.png'); /* 右側に配置する画像を指定 */
    background-repeat: no-repeat; /* 画像を繰り返さない */
    background-position: center; /* 画像を中央に配置 */
    background-size: contain; /* 画像の比率を保ちながら縮小 */
    margin-left: 20px; /* テキストとの余白を調整 */
    padding: 0; /* 余白を削除 */
    display: block; /* 表示を確実にするために block 指定 */
    z-index: 5; /* z-index を調整して消えないように */
}
	
	.title-text h2 {
    font-size: 1.5rem; /* メイン見出しのサイズ */
    color: #2a4b9b; /* メイン見出しの色 */
    margin: 0; /* 余白をなくす */
    font-weight: bold;
		text-align:left;
}

	
	.exam {
    background: #E8E8F3; /* 背景色を設定 */
    padding-top: 70px; /* 上部の余白を設定 */
    padding-bottom: 200px; /* 下部の余白を追加して背景画像を見やすく */
    position: relative; /* 背景画像を制御するために position を設定 */
    z-index: 1; /* 親要素のz-indexを1に設定 */
}
	
	
	.features-content{
		text-align:left;
	}
	
}

.purple{
	color:#6E64ED;
}

.green{
	color:#18C94A;
}





/* アニメーション用のキーフレーム */
@keyframes pathmove {
    0% {
        height: 0;
        top: 0;
        opacity: 0;
    }
    30% {
        height: 40px;
        opacity: 1;
    }
    100% {
        height: 0;
        top: 80px;
        opacity: 0;
    }
}




section .inner{
	max-width:1200px;
	margin:0 auto;
	padding:0 20px;
}









.morelink{
	width:100%;
	margin:0 auto;
}

.morelink a{
	text-decoration:none;
	color:#000;
	font-size:20px;
	border:solid 2px;
	padding:10px 0;
	border-radius:50px;
	display:block;
	text-align:center;
	max-width:300px;
	width:100%;
	min-width:200px;
	margin:50px auto 0;
	transition:.3s ease;
}

.morelink a:hover{
	background:#3A9CFA;
	color:#fff;
}

.homeContact{
	position:relative;
}

.homeContact .inner{
    background: #fff;
    position: relative;
    top: -80px;
    padding: 40px 80px;
		max-width: unset;
    margin: 0 8%;	
}

.homeContact__content{
    display: flex;
    justify-content: space-between;	
		gap:50px;
	align-items:center;
	border-bottom:solid 2px #D8D8D8;
	padding-bottom:30px
}

.homeContact__content .contact_ttl{
	text-align:center;
	background:#000;
	color:#fff;
	font-weight:bold;
	width:50%;
	border-radius:5px;
	padding:20px 0;
}

.homeContact__content .contact_ttl .top{
	font-size:20px;
}

.homeContact__content .contact_ttl .bottom{
	font-size:28px;
	letter-spacing:10px;
	position:relative;
    line-height: 1;
	width:fit-content;
	margin: 10px auto 0;
}

.homeContact__content .contact_ttl .bottom:before{
	content:"";
	width:50px;
	height:2px;
	background:#fff;
	display:block;
	position:absolute;
	left:-70px;
	top:50%;
	transform:translate(-50%, -50%);
}

.homeContact__content .contact_ttl .bottom:after{
	content:"";
	width:50px;
	height:2px;
	background:#fff;
	display:block;
	position:absolute;
	right:-100px;
	top:50%;
	transform:translate(-50%, -50%);
}

.homeContact__content .grid_cate{
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
	align-items:center;
	justify-content:center
}

.homeContact__content .grid_cate p{
	background:#D8D8D8;
	padding:10px;
	border:solid 2px;
}

.ftr_tel{
	max-width:768px;
	margin:50px auto;
}

.ftr_links{
	display:flex;
	justify-content:center;
	gap:20px;
}

.ftr_links p{
	width:300px
}

.ftr_links .form a,
.ftr_links .line a {
    color: #000;
    font-weight: bold;
    text-decoration: none;
    margin: 0 auto;
    width: 100%;
    border: solid 2px;
    padding: 13px 0px;
    border-radius: 50px;
    font-size: 14px;
    position: relative;
		display:block;
	text-align:center;
}

.ftr_links .form a i:before,
.ftr_links .line a i:before {
    content: "";
    width: 20px;
    height: 20px;
    position: absolute;
    top: 50%;
    transform: translate(12px, -50%);
    left: 10px;
    background-size: contain;
    background-repeat: no-repeat;
    display: block;
}

.ftr_links .form a:after,
.ftr_links .line a:after{
    content: "";
    background-image: url(/wp-content/themes/original/assets/images/link_arow.svg);
    background-size: contain;
    transition: .3s ease;
    width: 18px;
    height: 10px;
    display: block;
    right: 0;
    position: absolute;
    top: 50%;
    transform: translate(-20px, -50%);
    background-repeat: no-repeat;
}


.ftr_links .form a:hover:after,
.ftr_links .line a:hover:after{
    transform: translate(-10px, -50%);
}

.ftr_links .form a i:before{
    background-image: url(/wp-content/themes/original/assets/images/icon_form.png);
}

.ftr_links .line i:before {
    background-image: url(/wp-content/themes/original/assets/images/icon_line.png);
}

.home_blog{
	background:#F4F4FA;
	padding:100px 0 200px;
  background-image: url(/wp-content/themes/original/assets/images/bg_blog.png);	
}

.home_blog .blog_grid{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 50px;	
}

.home_blog .blog_grid figure{
	position:relative;
}

.home_blog .blog_grid figure figcaption{
	position:absolute;
	padding:10px;
	background:#000;
	color:#fff;
}

.home_blog .blog_grid .txt{
	padding:20px;
	background:#fff;
	position:relative;
    min-height: 150px;	
}

.home_blog .blog_grid .txt .morelink{
	position:absolute;
	right:0;
	bottom:0;
    width: fit-content;	
}

.home_blog .blog_grid .txt .morelink a{
	border:unset;
	background:#000;
	color:#fff;
	border-radius:10px 10px 0 0;
	max-width:unset;
	width:fit-content;
	min-width:unset;
	padding:10px 40px 10px 10px;
	font-size:16px;
	margin:0;
}

.home_blog .blog_grid .txt .morelink a:after{
    content: "";
    background-image: url(/wp-content/themes/original/assets/images/arrow_w.png);
    background-size: contain;
    transition: .3s ease;
    width: 18px;
    height: 10px;
    display: block;
    right: 0;
    position: absolute;
    top: 50%;
    transform: translate(-10px, -40%);
    background-repeat: no-repeat;	
}

.home_blog .blog_grid .txt .morelink a:hover:after{
    transform: translate(-5px, -40%);	
}

.home_blog .morelink a {
	background:#fff;
}

.home_blog .morelink a:hover{
	background:#3a9cfa;
	color:#fff;
}

footer{
    padding: 80px 0 20px;	
}

footer .ftr_inr{
	display:flex;
	justify-content:space-between;
		max-width:1200px;
	padding;0 20px;
	margin:0 auto;
	gap:5%;
}

footer .ftr_inr .left{
	width:25%;
}

footer .ftr_inr .left .ftr_logo a{
	max-width:150px;
	margin:0 auto 10px;
	display: block;	
}

footer .ftr_inr .left .ftr_logo p{
	font-size:12px;
	text-align:center;
}

footer .ftr_inr .left .ftr_tel{
	margin:30px auto;
}

footer .ftr_inr .left .ftr_txt{
	font-size:10px;
	text-align:center;
	color:#9E9E9E;
}

footer .ftr_inr .center{
	width:40%;
}

footer .ftr_inr .center ul{

    grid-template-columns: 1fr 1fr;	
	border-left:solid 1px #9E9E9E;
	padding-left:20px;
}

footer .ftr_inr .center ul li{
	margin:10px 0;
}

footer .ftr_inr .center ul li a{
	color:#000;
	
}

footer .ftr_inr .center .ftr_bnr{
	max-width:300px;
	margin-top:20px;
}

footer .ftr_inr .right {
  	width:100%;
  grid-template-rows: auto auto auto; /* Adjusted to accommodate the h3 */
}

footer .ftr_inr .right .contact-heading {
  font-size: 16px; /* Slightly larger for emphasis */
  color: #333; /* Dark text for better readability */
  margin-bottom: 10px; /* Additional space below the heading */
  font-weight: bold;
  text-align: center; /* Centers the heading */
}

footer .ftr_inr .right a {
  position: relative;
  padding: 30px 10px;

  border: solid 1px #9E9E9E;
  border-radius: 20px;
  display: block;
  text-align: center;
  font-weight: bold;
  font-size: 16px;
  color: #000;
  text-decoration: none;
	margin-bottom:20px;
}

footer .ftr_inr .right a.form i:before, footer .ftr_inr .right a.line i:before {
  content: "";
  width: 30px;
  height: 30px;
  position: relative;
  top: 10%; /* Adjusted from 5% to 10% to lower the icon */
  transform: translate(-50%, 0%);
  left: 50%;
  background-size: contain;
  background-repeat: no-repeat;
  display: block;
  margin-bottom: 20px;
}


footer .ftr_inr .right a.form i.icon_form:before {
  background-image: url('/wp-content/themes/original/assets/images/icon_form.png');
}

footer .ftr_inr .right a.line i.icon_line:before {
  background-image: url('/wp-content/themes/original/assets/images/icon_line.png');
}

footer .ftr_inr .right a:after {
  content: "";
  background-image: url('/wp-content/themes/original/assets/images/arrow_ftr.png');
  background-size: contain;
  transition: .3s ease;
  width: 36px;
  height: 20px;
  display: block;
  left: 50%;
  position: absolute;
  bottom: 10px;
  transform: translate(-50%, 0);
  background-repeat: no-repeat;
}


footer .prev_top{
    width: 100px;
    height: 100px;
    margin: 50px 0 0;
    position: relative;
    left: 50%;
    transform: translate(-50%, 0px);	
}




/*追加分*/

.contact-heading{
	width:100%;
	text-align:center;
	font-size:20px;
}

.mvunder .right a {
  position: relative;
  padding: 30px 10px;

  border: solid 1px #9E9E9E;
  border-radius: 20px;
  display: block;
  text-align: center;
  font-weight: bold;
  font-size: 16px;
  color: #000;
  text-decoration: none;
	margin-bottom:20px;
}

.mvunder .right a.form i:before, .mvunder .right a.line i:before {
  content: "";
  width: 30px;
  height: 30px;
  position: relative;
  top: 10%; /* Adjusted from 5% to 10% to lower the icon */
  transform: translate(-50%, 0%);
  left: 50%;
  background-size: contain;
  background-repeat: no-repeat;
  display: block;
  margin-bottom: 20px;
}


.mvunder .right a.form i.icon_form:before {
  background-image: url('/wp-content/themes/original/assets/images/icon_form.png');
}

.mvunder .right a.line i.icon_line:before {
  background-image: url('/wp-content/themes/original/assets/images/icon_line.png');
}

.mvunder .right a:after {
  content: "";
  background-image: url('/wp-content/themes/original/assets/images/arrow_ftr.png');
  background-size: contain;
  transition: .3s ease;
  width: 36px;
  height: 20px;
  display: block;
  left: 50%;
  position: absolute;
  bottom: 10px;
  transform: translate(-50%, 0);
  background-repeat: no-repeat;
}



@media screen and ( max-width:1200px ) {
	.pagebnr{
		max-width:768px;
	}
	
	.voice_info .voice_cont{
    grid-template-columns: 1fr;		
	}
	
	.philosophy .centerbox .center{
		text-align:left;
		padding: 0 20px;		
	}
	
	.homeContact__content{
		display:block;
	}
	
	.homeContact__content .contact_ttl{
		margin:0 auto 30px;
	}
	
	.homeContact__content .contact_ttl .bottom:before{
    width: 50%;
    left: -50%;		
	}
	
	.homeContact__content .contact_ttl .bottom:after{
    width: 50%;
    right: -100%;	
	}
	
	.ftr_links{
		display: grid;
    justify-content:unset;
	}
	
	.ftr_links p {
    width: 100%;
	}
	
	.home_blog .blog_grid{
    grid-template-columns: 1fr 1fr;	
		gap:20px;
	}
	
	footer {
			padding: 80px 20px 20px;
	}	
	
}


@media screen and ( max-width:550px ) {
	
	.pc{display:none;}
	.sp{display:block;}
	
	
	.homeContact .inner{
		margin:0 20px;
    padding: 20px 0px;		
	}	
	
	.homeContact__content .contact_ttl{
		width:80%;
	}
	
	.homeContact__content .grid_cate{
		gap:5px;
	}
	
	.homeContact__content .grid_cate p{
		padding:5px;
		font-size: 10px;		
	}	
	
	.ftr_tel {
    max-width: 280px;
    margin: 20px auto;		
	}
	
	.home_blog .blog_grid figure figcaption{
		padding: 5px;
		font-size:10px;
	}
	
	.home_blog .blog_grid .txt{
		padding:10px;
	}	
	
	.home_blog .blog_grid .txt .morelink a{
		font-size:10px;
    padding: 5px 35px 5px 10px;		
	}
	
	.home_blog{
		padding:100px 0 100px;
	}
	
	footer .ftr_inr	{
		display: grid;
    grid-template-columns: 1fr;
		gap: 20px;		
	}
	
	footer .ftr_inr .left{
		 width: 100%;		
	}
	
	footer .ftr_inr .center	{
        order: 3;	
		width:100%;
	}
	
	footer .ftr_inr .right{
        order: 2;
        width: 100%;
        grid-template-columns: 1fr 1fr;		
	}	
	
	footer .ftr_inr .left .ftr_logo a{
		max-width:120px;
	}	
	
	footer .ftr_inr .left .ftr_tel {
			margin: 30px auto 0;
			max-width: 240px;
	}	
	
	footer .ftr_inr .right a{
		padding:20px 0 30px;
        font-size: 10px;		
	}
	
footer .ftr_inr .right a.form i:before, footer .ftr_inr .right a.line i:before{
		margin-bottom:10px;
	}
	
	footer .ftr_inr .right a:after{
		bottom:0;
	}
	
	footer .ftr_inr .center ul{
		border-left:0;
    padding-left: 0px;		
    grid-template-columns: 0.8fr 1.2fr;		
	}	
	
	footer .ftr_inr .center ul li{
		margin:0;
		padding:10px 0;
	}	
	
	footer .ftr_inr .center ul li:nth-child(odd){
		
	}
	
	footer .ftr_inr .center ul li:nth-child(even){
    border-left: solid 1px #9E9E9E;
        padding-left: 20px;		
	}
	
	footer .ftr_inr .center .ftr_bnr{
		margin:20px auto 50px;
	}
	
	footer .prev_top{
		margin-top:0;
	}
	
	.ftr_txt.sp{
		color:#9E9E9E;
		font-size:10px;
		text-align:center;
		margin-top:10px;
	}
	
    .works_slide .btn_wrap .np_btn {
        position: relative;
        bottom: 100px;
    }	
	
	.morelink{
    margin: 100px auto 0;		
	}
	
	.main_nav_wrap{
    display: grid;
		justify-content: center;
	}
	
	.main_nav_wrap .nav_link,.main_nav_wrap nav{
		width:100%;
	}
	
	.main_nav_wrap .nav_link .n_left, .main_nav_wrap nav ul {
    position: static;
		transform:unset;
	}

	.main_nav_wrap nav{
		order:1;
	}

	.main_nav_wrap .nav_link{
		order:2;
	}
	
	.main_nav_wrap nav .close_btn {
    position: absolute;
    right: 20px;
    top: 30px;
	}
	
.main_nav_wrap nav ul li {
    margin: 30px 0;
}	
	
.main_nav_wrap nav ul{
		    margin: 70px 20px 0;
	}
	
	.main_nav_wrap .nav_link .n_left .n_logo{
		max-width:150px;
	}
	
	.main_nav_wrap .nav_link .links .tel{
		    margin: 20px auto 0px;
	}
	
	.nav_bttom{
        position: absolute;
        bottom: 0;
        width: 100vw;
        margin: 0 calc(50% - 50vw);
	}
	
	.nav_bttom .in{
		display: grid;
    grid-template-columns: 1fr 1fr;
        border-top: 2px solid;		
	}
	
	.nav_bttom .in a{
        text-decoration: none;
        color: #000;
        text-align: center;		
        padding: 10px;
		position:relative;
	}
	
	.nav_bttom .in a.form{
		border-right:solid 2px;
	}

	.nav_bttom .in a i.i_form:before{
        content: "";
        width: 22px;
        height: 22px;
        position: absolute;
        top: 50%;
        transform: translate(0px, -50%);
    left: 10px;
    background-size: contain;
    background-repeat: no-repeat;
    display: block;
    background-image: url(/wp-content/themes/original/assets/images/images/icon_form.png);		
	}
	
	.nav_bttom .in a i.i_line:before{
        content: "";
        width: 22px;
        height: 22px;
        position: absolute;
        top: 50%;
        transform: translate(0px, -50%);
    left: 10px;
    background-size: contain;
    background-repeat: no-repeat;
    display: block;
    background-image: url(/wp-content/themes/original/assets/images/images/icon_line.png);
	}

	.nav_bttom .in a:after{
    content: "";
    background-image: url(/wp-content/themes/original/assets/images/arrow_bk.png);
    background-size: contain;
    transition: .3s ease;
    width: 18px;
    height: 10px;
    display: block;
    right: 0;
    position: absolute;
    top: 50%;
    transform: translate(-10px, -50%);
    background-repeat: no-repeat;		
	}
	
}



/* Contact Form7スマホ・タブレット用カスタマイズ */
@media(max-width:850px){
	
	
	.main_nav_wrap nav ul li {
    margin: 10px 0;
}	
	
	
/* テーブルの見出しとフォーム */
table.inquiry th,table.inquiry td {
   display:block;
   padding:1em 0!important;
   width:100%;
   border:0;
}

/* 送信ボタン */
input.wpcf7-submit{
   margin-bottom:30px;
   width:100%;
}
}

/* 日付タグ上のテキストをPCとスマホで変更 */
@media(max-width:900px){
.pcdate{
   display: none;
}
}
@media(min-width:1000px){
.spdate{
   display: none;
}
/* 日付タグの幅を調整 */
.wpcf7-date.dateform{
   width: 25%;
}
}

/* Contact Form7全体カスタマイズ */

/* 自動入力されるPタグを無効にする */
.inquiry p {
   display: inline;
}

/*テーブル下に余白.枠線・テキストの行間 */
table.inquiry {
	margin-top:30px;
	width:100%;
   margin-bottom: 30px;
   border:solid 1px #d7d7d7;
   line-height:1.2;
   vertical-align:middle;
}

/* テーブルの行 */
.inquiry tr {
   border:0!important;
}

/* テーブルの見出し側 */
.inquiry th{
   text-align:left;
   font-size:14px;
   color:#444;
   padding:1em 0.5em;
   width:0;
   background:#efefef;
   border:solid 1px #d7d7d7;
   white-space: nowrap;
}

/* 必須と任意タグ */
.haveto,.any{
   font-size:13px;
   padding:5px;
   background:#ff9393;
   color:#fff;
   border-radius:2px;
   margin-right:5px;
   font-weight:normal;
}

/* 任意タグの背景カラー */
.any{
   background:#93c9ff;
}

/* テーブルフォーム側 */
.inquiry td{
   font-size:13px;
   border:solid 1px #d7d7d7;	
}

/* 入力エリア幅最大 */
.wpcf7-form-control {
   width: 100%;
}

/* フォーム入力欄の余白・背景カラー・枠線消す指定 */
.inquiry input,.inquiry select,.inquiry textarea {
   margin: 5px 0;
   background:#eff1f5;
   border: none;
   padding:0.7em;
}
.inquiry textarea {
   padding-bottom:10em;
}

/* チェックボックスとラジオボタンの位置調整 */
.wpcf7-list-item-label,.wpcf7-checkbox,input[type=checkbox],input[type=radio]{
   vertical-align:middle;
}
.wpcf7-list-item-label{
   padding:0 5px 0 2px;
}
/*ラジオボタンを縦並び指定*/
.verticallist{
   display:inline-grid;
}

/* 送信ボタンのデザイン */
.wpcf7-submit{
   display: block;
   margin:10px auto;
   padding:1em 0;
   width:80%;
   background:#09b555;
   color:#fff;
   font-size:18px;
   font-weight:bold;	 
   border-radius:4px;
   border: none;
}

/* 送信ボタンマウスホバー時 */
.wpcf7-submit:hover{
   opacity: 0.9;
   transition: 0.3s;
}

/* フォーム上部に表示されるエラーメッセージを非表示 */
.screen-reader-response {
    display: none;
}

/* フォーム内エラーメッセージを赤色に指定 */
.wpcf7-not-valid-tip {
    color: #e92323;
}


  /* .ftr_menu のスタイル */
.ftr_menu {
    width: 100%; /* 親要素の幅を100%に設定 */
    margin: 0; /* 余白を削除 */
    padding: 0; /* 内側の余白を削除 */
    text-align: left; /* 左揃えに設定 */
}

/* リストのスタイルを設定 */
.ftr_menu ul {
    list-style: none; /* リストのドットや番号を削除 */
    padding: 0; /* 内側の余白を削除 */
    margin: 0; /* 余白を削除 */
}

/* 各リスト項目のスタイルを設定 */
.ftr_menu li {
    display: block; /* 各リスト項目をブロック要素として表示（横幅いっぱいに） */
    width: 100%; /* 各項目の幅を100%に設定 */
    margin: 0; /* 上下の余白を削除 */
    padding: 5px 0; /* 必要に応じて上下の余白を調整 */
}

/* リンクのスタイルを設定 */
.ftr_menu li a {
    display: block; /* リンク全体をブロック要素として表示 */
    width: 100%; /* リンクの幅を100%に設定 */
    text-decoration: none; /* 下線を削除 */
    color: #333; /* テキストの色を設定（必要に応じて変更） */
    padding: 5px 0; /* 上下に余白を設定（必要に応じて調整） */
}

/* レスポンシブ対応のスタイル */
@media (max-width: 768px) {
    .ftr_menu {
        text-align: center; /* スマホ表示時は中央揃えに */
    }

    .ftr_menu li {
        text-align: center; /* スマホ表示時は各リスト項目を中央揃えに */
    }

    .ftr_menu li a {
        text-align: center; /* スマホ表示時のリンクを中央揃えに */
    }
}


h1.mainmidashi {
  position: relative;
  padding: 1rem 2rem;
  border-bottom: 6px solid #00159F;
	font-size:20px !important;
	margin-top:20px;
}

h1.mainmidashi:before {
  position: absolute;
  bottom: -6px;
  left: 0;
  width: 20%;
  height: 6px;
  content: '';
  background: #38FA76;
	font-size:20px !important;
}

h2.mainmidashi {
  position: relative;
  padding: 1rem 2rem;
  border-bottom: 6px solid #00159F;
	font-size:20px !important;
	margin-top:20px;
}

h2.mainmidashi:before {
  position: absolute;
  bottom: -6px;
  left: 0;
  width: 20%;
  height: 6px;
  content: '';
  background: #38FA76;
	font-size:20px !important;
}

.spacetop{
margin-top:60px;
}

.spacetopkotei{
margin-top:100px;
}


/* table01 */
#table01{
	width:100% !important;
}

#table01 tr {
  border-bottom: 1px solid #b5b1b1;
}

#table01 th,
#table01 td {
  padding: 24px 0;
  border: none;
}

#table01 th {
  width: 30%;
}

/* sp */
@media only screen and (max-width: 480px) {
  #table01 th,
  #table01 td {
    width: 100%;
    display: block;
  }

  #table01 th {
    width: 100%;
  }

  #table01 td {
    padding-top: 0;
  }
}


/* Contact Form7スマホ・タブレット用カスタマイズ */
@media(max-width:850px){
/* テーブルの見出しとフォーム */
table.inquiry th,table.inquiry td {
   display:block;
   padding:1em 0!important;
   width:100%;
   border:0;
}
	
	
	h1.big{
		font-size:30px !important;
	}
	
}

/* 全体のスタイル */
.terms {
    font-family: Arial, sans-serif;
    line-height: 1.6;
    color: #333;
    max-width: 800px;
    margin: 0 auto;
    padding: 20px;
    background-color: #f9f9f9;
    border: 1px solid #ddd;
    border-radius: 8px;
}

/* セクションタイトル（第一章、第二章） */
.section-title {
    font-size: 1.5em;
    margin-top: 1.5em;
    margin-bottom: 0.5em;
    font-weight: bold;
    color: #444;
    border-bottom: 2px solid #ccc;
    padding-bottom: 5px;
}

/* 各条項のタイトル（第1条、第2条など） */
.article-title {
    font-size: 1.2em;
    margin-top: 1.2em;
    margin-bottom: 0.3em;
    font-weight: bold;
    color: #555;
}

/* 条項の内容 */
.article-content {
    font-size: 1em;
    margin-bottom: 1em;
    padding-left: 15px;
    text-indent: -15px;
}

/* リスト風スタイル */
.article-content br + br {
    display: block;
    margin-bottom: 10px;
}


.qa-7 {
    max-width: 1200px;
    margin-bottom: 10px;
    border: none;
    border-radius: 5px;
    box-shadow: 0 4px 4px rgb(0 0 0 / 2%), 0 2px 3px -2px rgba(0 0 0 / 5%);
    background-color: #fff;
}

.qa-7 summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    padding: 1em 2em 1em 3em;
    color: #333333;
    font-weight: 600;
    cursor: pointer;
}

.qa-7 summary::before,
.qa-7 p::before {
    position: absolute;
    left: 1em;
    font-weight: 600;
    font-size: 1.3em;
}

.qa-7 summary::before {
    color: #75bbff;
    content: "Q";
}

.qa-7 summary::after {
    transform: translateY(-25%) rotate(45deg);
    width: 7px;
    height: 7px;
    margin-left: 10px;
    border-bottom: 3px solid #333333b3;
    border-right: 3px solid #333333b3;
    content: '';
    transition: transform .5s;
}

.qa-7[open] summary::after {
    transform: rotate(225deg);
}

.qa-7 p {
    position: relative;
    transform: translateY(-10px);
    opacity: 0;
    margin: 0;
    padding: .3em 3em 1.5em;
    color: #333;
    transition: transform .5s, opacity .5s;
}

.qa-7[open] p {
    transform: none;
    opacity: 1;
}

.qa-7 p::before {
    color: #ff8d8d;
    line-height: 1.2;
    content: "A";
}

.faqbox {
    width: 90%; /* 必要に応じて調整 */
    max-width: 1000px; /* 必要に応じて調整 */
    margin: 0 auto;
    padding: 20px; /* 任意で追加してコンテンツに余白を付与 */
    display: block;
}

	@media(max-width:850px){
		.faqbox {
    width: 100%; /* 必要に応じて調整 */
    max-width: 800px; /* 必要に応じて調整 */
    margin: 0 auto;
    padding: 0px; /* 任意で追加してコンテンツに余白を付与 */
    display: block;
}

}


.startplan-banner{position:fixed;bottom:10px;left:-2px;text-align:right;z-index:10}
@media (max-width: 560px) {
.startplan-banner{bottom:5px}
}
.startplan-banner img{width:60%}
@media (max-width: 560px) {
.startplan-banner img{width:75%}
}

.btn2,a.btn2,button.btn2{font-size:1.2rem;font-weight:700;line-height:1.5;position:relative;display:inline-block;padding:1rem 2rem;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-transition:all .3s;transition:all .3s;text-align:center;vertical-align:middle;text-decoration:none;letter-spacing:.1em;color:#212529;border-radius:.5rem}
a.btn--orange{color:#fff;background-color:#FF3C53;border-bottom:5px solid #b84c00}
a.btn--orange:hover{margin-top:3px;color:#fff;background:#f56500;border-bottom:2px solid #b84c00}
a.btn--shadow{-webkit-box-shadow:0 3px 5px rgba(0,0,0,.3);box-shadow:0 3px 5px rgba(0,0,0,.3)}
.planbox img{padding-top:20px!important;margin:0 auto;width:100%}
.pc{display:block}
.sp{display:none}
@media (max-width: 560px) {
.pc{display:none}
.sp{display:block}
.btn2,a.btn2,button.btn2{font-size:0.8rem;font-weight:700;line-height:1.3;position:relative;display:inline-block;padding:1rem 1rem;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-transition:all .3s;transition:all .3s;text-align:center;vertical-align:middle;text-decoration:none;letter-spacing:.1em;color:#fff;border-radius:.5rem}
}


@media (max-width: 560px) {
	.logo{
		max-width:150px;
	}

}

.spacebottom{
	margin-bottom:30px !important;
}

img.border{
	border:1px solid #ccc;
}


.sectionblog {

padding-bottom:2.5em;
    max-width: 1100px;
    border-radius: 8px;

}

.sectionblog .subtitle {
    font-size: 1.5em;
    margin-bottom: 0.5em;
    color: #4CAF50;
}

.sectionblog .paragraph {
    margin-bottom: 1em;
}

.sectionblog .list {
    margin-left: 1.5em;
    list-style-type: disc;
}

.sectionblog .heading {
    font-size: 1.2em;
    margin-top: 1em;
    color: #333;
}

.innerblog {
    max-width: 1100px;
    margin: 0 auto;
    padding: 20px;
	margin-top:100px;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.innerblog h1 {
    font-size: 1.7em;
    color: #333;
    margin-bottom: 15px;
}

.post-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.9em;
    color: #666;
    margin-top: 10px;
    border-top: 1px solid #ddd;
    padding-top: 10px;
}

.post-meta .date {
    font-weight: bold;
    color: #4CAF50;
}

.post-meta .categories {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 10px;
}

.post-meta .categories li {
    background-color: #f4f4f4;
    padding: 5px 10px;
    border-radius: 5px;
    color: #333;
    font-size: 0.85em;
}

.post-meta .categories li:hover {
    background-color: #4CAF50;
    color: white;
    cursor: pointer;
}


.design01 {
 width: 100%;
 text-align: center;
 border-collapse: collapse;
 border-spacing: 0;
}
.design01 th {
 padding: 10px;
 background: #e9faf9;
 border: solid 1px #778ca3;
}
.design01 td {
 padding: 10px;
 border: solid 1px #778ca3;
}


.youtube {
  width: 100%;
  aspect-ratio: 16 / 9;
}
.youtube iframe {
  width: 100%;
  height: 100%;
}


/*250216追加*/
#mv2{ width: 100%; height: 75vh; min-height: 750px; display: flex; align-items: center; justify-content: center; position: relative; z-index: 1; overflow: hidden;}
#mv2:after{ content: ""; width: 100%; height: 100%; background: url("../images/mv_bg.jpg") no-repeat right center; background-size: cover; position: absolute; right: 0; top: 0; z-index: -1;}

@media screen and (max-width:1260px){
#mv_in{ width: 100%; max-width: 1200px; margin: 0 30px;}
}
#mv_txt{ display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; margin: 0;}
#mv_txt figure.mv_logo{ margin: 0 auto 80px; text-align: center;}
#mv_txt figure.mv_logo img{ height: 100px;}
#mv_txt p{ font-size: 40px; font-weight: bold; line-height: 1em; color: #102984; margin-bottom: 20px;}
#mv_txt p span{ font-size: 80%;}
#mv_txt p strong.waku{ display: inline-block; border: 1px solid #102984; padding: 0.125em 0.125em 0.25em; margin: 0 0.125em;}
#mv_txt p strong.waku:first-child{ margin-left: 0;}
#mv_txt p strong.underline{ text-decoration: underline; font-feature-settings: "palt"; margin-left: 0.125em;}
#mv_txt p strong.underline strong{ font-size: 140%;}
#mv_txt h1{ font-size: 56px; line-height: 1em; color: #102984; margin-bottom: 40px;}
#mv_txt h1 span{ font-size: 54px;}
#mv_txt h2{ display: flex; align-items: center; justify-content: center; margin: auto; background: #102984; color: #fff; font-size: 20px; padding: 0.125em 2em 0.25em; border-radius: 4px;}
#mv_txt .mv_btn{ margin: 80px auto 0;}
#mv_txt .mv_btn a{ display: flex; align-items: center; justify-content: center; width: 400px; height: 60px; background: #e50c45; color: #fff; font-size: 18px; font-weight: bold; text-decoration: none; position: relative; border-radius: 30px; transition: 0.3s; box-shadow:rgba(110, 100, 237, 0.25) 0 8px 6px;}
#mv_txt .mv_btn a:after{ content: ""; width: 20px; height: 10px; background: url("../images/btn_arrow.png") center center no-repeat; background-size: 100%; position: absolute; right: 12px; top: 50%; transform: translateY(-50%);}
#mv_txt .mv_btn a:hover{ opacity: 0.7;}
.spbr{display:none;}
@media screen and (max-width:768px){
	.spbr{display:block;}
#mv2{ display: block; height: auto; min-height: 100vw; padding: 25vw 0 12.5vw;}
#mv2:after{ background: url("../images/mv_bg_smp.jpg") no-repeat center 33.33vw; background-size: 100% auto;}
#mv_in{ max-width: 92%; margin: 0 auto; display: block;}
#mv_txt figure.mv_logo{ display: none;}
#mv_txt p{ font-size: 5.25vw; margin-bottom: 2.5vw;}
#mv_txt p span{ font-size: 80%;}
#mv_txt p strong.underline strong{ font-size: 125%;}
#mv_txt h1{ font-size: 6vw; margin-bottom: 5vw;}
#mv_txt h1 span{ font-size: 5.75vw;}
#mv_txt h2{ font-size: 3.2vw; width: 100%; padding: 0.125em 0.25em 0.25em;}
#mv_txt .mv_btn{ margin: 80vw auto 0;}
#mv_txt .mv_btn a{ width: 90.66vw; height: 15vw; font-size: 3.75vw; border-radius: 12.5vw;}
#mv_txt .mv_btn a:after{ width: 4vw; height: 2vw; right: 3.75vw;}
}
#mv_in {
  width: 100%;
  max-width: 1200px;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: space-between; /* 横並びにする */
  gap: 30px;
}

#mv_txt {
  width: 65%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

#mv_slider {
  width: 35%;
  max-width: 450px;
}

/* スライダーのサイズ調整 */
.swiper {
  width: 100%;
  height: auto;
}

.swiper-slide img {
  width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: 10px;
}

/* レスポンシブ */
@media screen and (max-width: 768px) {
  #mv_in {
    flex-direction: column; /* スマホでは縦並び */
    align-items: center;
  }
  #mv_txt, #mv_slider {
    width: 70%;
    text-align: center;
  }
}

/* スライド下のドット（ページネーション） */
.swiper-pagination {
  position: absolute;
  bottom: 10px;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
}

.swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  background: #ddd; /* 通常のドットの色 */
  opacity: 0.7;
  border-radius: 50%;
  margin: 0 5px;
  transition: 0.3s;
}

.swiper-pagination-bullet-active {
  background: #102984; /* アクティブなドットの色 */
  opacity: 1;
  transform: scale(1.2); /* アクティブなドットを少し大きくする */
}

.ctabox{ margin: 0;}
.ctabox_price{ width: 768px; display: flex; flex-direction: column; align-items: center; justify-content: center; margin: auto; background: #fff; padding: 50px 30px 30px; border: 1px solid #e7e7f2; border-radius: 20px; text-align: center; box-shadow:rgba(110, 100, 237, 0.25) 0 8px 8px;}
.ctabox_price h3{ margin-bottom: 40px; position: relative;}
.ctabox_price h3:before{ content: ""; width: 50px; height: 2px; background: #000; position: absolute; top: 50%; left: -60px; transform: translateY(-50%) rotate(60deg);}
.ctabox_price h3:after{ content: ""; width: 50px; height: 2px; background: #000; position: absolute; top: 50%; right: -60px; transform: translateY(-50%) rotate(-60deg);}
.ctabox_price h3 strong{ font-size: 32px; line-height: 1em; font-weight: bold; display: inline-block; position: relative; z-index: 1;}
.ctabox_price h3 strong:after{ content: ""; width: 100%; height: 12px; background: rgba(62,249,106,0.15); position: absolute; left: 0; right: 0; bottom: -6px; z-index: -1;}
.ctabox_price_in{ display: flex; align-items: center; justify-content: space-between;}
.ctabox_price_in figure.arrow{ width: 32px; margin: 0 20px;}
.ctabox_price_in dl{ display: flex; align-items: center; justify-content: center;}
.ctabox_price_in dl dt{ background: #102984; color: #fff; font-size: 24px; line-height: 1.125em; padding: 0.25em 0.25em 0.25em; font-weight: bold; width: 40px; border-radius: 4px;}
.ctabox_price_in dl dd{ display: flex; align-items: flex-end; font-size: 28px; color: #102984; font-weight: bold; margin-left: 8px;}
.ctabox_price_in dl dd strong{ font-size: 82px; line-height: 1em; font-weight: bold; }
.ctabox_price_in dl dd span{ position: relative; top: 0.33em;}
.ctabox_price_in dl:last-child dt{ background: #e50c45;}
.ctabox_price_in dl:last-child dd{ color: #e50c45;}
.ctabox_price_in dl:last-child dd{ position: relative; z-index: 1;}
.ctabox_price_in dl:last-child dd:after{ content: ""; width: 100%; height: 12px; background: rgba(229,12,69,0.15); position: absolute; left: 0; right: 0; bottom: -6px; z-index: -1;}
.ctabox_price p.att{ font-size: 16px; font-weight: 500; margin-top: 20px;}
.ctabox_btn{ margin: 60px auto 20px;}
.ctabox_btn a{ display: flex; align-items: center; justify-content: center; margin: auto; width: 540px; height: 72px; padding-bottom: 0.125em; background: #e50c45; color: #fff; font-size: 24px; font-weight: bold; text-decoration: none; position: relative; border-radius: 40px; transition: 0.3s; box-shadow:rgba(110, 100, 237, 0.25) 0 8px 6px; font-feature-settings: "palt";}
.ctabox_btn a:after{ content: ""; width: 30px; height: 15px; background: url("../images/btn_arrow.png") center center no-repeat; background-size: 100%; position: absolute; right: 20px; top: 50%; transform: translateY(-50%);}
.ctabox_btn a:hover{ opacity: 0.7;}
@media screen and (max-width:768px){
.ctabox_price{ width: 100%; padding: 7.5vw 2.5vw 5vw; border-radius: 2.5vw;}
.ctabox_price h3{ margin-bottom: 5vw}
.ctabox_price h3:before{ width: 10vw; left: -10vw;}
.ctabox_price h3:after{ width: 10vw; right: -10vw;}
.ctabox_price h3 strong{ font-size: 5vw;}
.ctabox_price h3 strong:after{ height: 2.5vw; bottom: -1.25vw;}
.ctabox_price_in figure.arrow{ width: 5vw; margin: 6.25vw 2.5vw 0;}
.ctabox_price_in dl{ display: block;}
.ctabox_price_in dl dt{ font-size: 3.2vw; letter-spacing: 0.25em; line-height: 1em; width: auto; padding: 0.25em 0.25em 0.33em; margin-right: 6.25vw;}
.ctabox_price_in dl dd{ font-size: 5vw; margin: 0;}
.ctabox_price_in dl dd strong{ font-size: 10vw;}
.ctabox_price_in dl dd span{ position: relative; top: 0.33em;}
.ctabox_price_in dl:last-child dd:after{ height: 2.5vw; bottom: -1.25vw;}
.ctabox_price p.att{ font-size: 2.5vw; margin-top: 5%;}
.ctabox_btn{ margin: 7.5vw auto 2.5vw;}
.ctabox_btn a{ width: 100%; height: 12.5vw; font-size: 4.2vw; padding-right: 7.5vw; border-radius: 12.5vw;}
.ctabox_btn a:after{ width: 5vw; height: 2.5vw; right: 3.75vw;}
}




.table-of-contents {
  border: 2px solid #e0e0e0;
  padding: 20px;
  background-color: #f9f9f9;
  margin-bottom: 20px;
  border-radius: 8px;
}
.table-of-contents h2 {
  font-size: 20px;
  margin-bottom: 15px;
  font-weight: bold;
}
.table-of-contents ul {
  list-style-type: none;
  padding-left: 0;
}
.table-of-contents ul li {
  margin: 8px 0;
}
.table-of-contents ul li a {
  text-decoration: none;
  color: #0073aa;
}
.table-of-contents ul li a:hover {
  text-decoration: underline;
}
.table-of-contents ul ul {
  padding-left: 20px;
  list-style-type: disc;
}

.mvunder{
	padding-bottom:70px;
}

.reviewbox{
	background:#E8E8F3;
	padding-bottom:70px;
}

.review {
            display: flex;
            align-items: center;
            margin-bottom: 20px;
            position: relative;
        }
 
        .avatar img {
            width: 70%;
            height: 70%;
            object-fit: cover;
        }
        .bubble {
            background: #fff;
            padding: 15px;
            border-radius: 15px;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
            max-width: 600px;
            position: relative;
        }
        .bubble::before {
            content: "";
            position: absolute;
            top: 50%;
            left: -15px;
            width: 0;
            height: 0;
            border-style: solid;
            border-width: 10px 15px 10px 0;
            border-color: transparent white transparent transparent;
            transform: translateY(-50%);
        }
        .review.right .bubble::before {
            left: auto;
            right: -15px;
            border-width: 10px 0 10px 15px;
            border-color: transparent transparent transparent white;
        }
        .review.right {
            flex-direction: row-reverse;
			
        }

.spaceleft{
	margin-left:30px;
}


 @media (max-width: 768px) {
	 
	 .spaceleft{
	margin-left:0px;
}
	 
	  .review.right {
            flex-direction: column;
			
        }

            .review {
                flex-direction: column;
                align-items: center;
                text-align: center;
            }
            .review .avatar {
                margin-bottom: 10px;
            }
            .bubble::before {
                display: none;
            }
        }

.bnbox{
	width:90%;
	margin:0 auto;
	margin-top:70px;
	margin-bottom:70px;
}