@charset "UTF-8";
/* CSS Document */

/*////////////////////////////////////

SP用レイアウト

////////////////////////////////////*/

@media screen and (max-width:768px){
	/**********************************
	
	全体レイアウト、共通設定
	
	**********************************/

	/*----------------------
	記事エリアの設定
	----------------------*/
	.article{
		font-size: 4vw;
	}

	.article p{
		line-height: 6.1vw;
	}
	
	.nomal_text{
		font-size: 4vw;
		line-height: 6.1vw;
	}
	
	.pc_view{
		display: none !important;
	}
	
	.sp_view{
		display: block !important;
	}
	/**********************************
	
	上部固定ヘッダー設定
	
	**********************************/
	
	/*----------------------
	上部固定ヘッダー全体
	----------------------*/
	.header{
		height: 11vw;
	}

	/*----------------------
	ヘッダー内部をカラム幅にする
	----------------------*/
	.header_inner{
		height: 11vw;
	}
	
	
	
	
	.top_logo{
		width: 25%;
	}
	
	
	
	/*----------------------------------------
	sp用下部cv 1つボタン
	-------------------------------------*/
	.sp_bottom_cv{
		display: flex;
		width: 100%;
		height: 13vw;
		position: fixed;
		bottom: 0;
		z-index: 5000;
		background-color: #00B900;
	}
	
	
	.sp_bottom_cv a{
		width: 100%;
		height: 13vw;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	
	.sp_bottom_cv p{
		font-size: 6.3vw;
		font-weight: bold;
		color: #fff;
	}
	
	
	
	
	
	
	
	/*----------------------
	ハンバーガーメニュー
	----------------------*/
	.menu-btn {
		 position: fixed;
		 top: 1.5vw;
		 right: 1vw;
		 display: flex;
		 height: 8.5vw;
		 width: 8.5vw;
		 justify-content: center;
		 align-items: center;
		 z-index: 90;
	}
	.menu-btn span,
	.menu-btn span:before,
	.menu-btn span:after {
		 content: '';
		 display: block;
		 height: 0.8vw;
		 width: 6.5vw;
		 border-radius: 3px;
		 background-color: #fff;
		 position: absolute;
	}
	.menu-btn span:before {
		 bottom: 8px;
	}
	.menu-btn span:after {
		 top: 8px;
	}


	#menu-btn-check:checked ~ .menu-btn span {
		 background-color: rgba(255, 255, 255, 0);/*メニューオープン時は真ん中の線を透明にする*/
	}
	#menu-btn-check:checked ~ .menu-btn span::before {
		 bottom: 0;
		 transform: rotate(45deg);
	}
	#menu-btn-check:checked ~ .menu-btn span::after {
		 top: 0;
		 transform: rotate(-45deg);
	}

	#menu-btn-check {
		 display: none;
	}
	
	
	.menu-content {
    width: 60%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 100%;/*leftの値を変更してメニューを画面外へ*/
    z-index: 80;
    background-color: rgba(25,25,25,0.80);
    transition: all 0.5s;/*アニメーション設定*/
	margin-left: 40%;
}
	
	
	.menu-content ul {
		 padding: 10vw 4vw 0;
	}
	.menu-content ul li {
		 list-style: none;
	}
	.menu-content ul li a {
		 display: block;
		 width: 100%;
		 font-size: 4.2vw;
		font-weight: 600;
		 box-sizing: border-box;
		 color:#fff;
		 text-decoration: none;
		 padding: 5vw 3vw 5vw 1.5vw;
		 position: relative;
	}

	#menu-btn-check:checked ~ .menu-content {
		 left: 0;/*メニューを画面内へ*/
	}
	
	
	
	
	
	/**********************************
	
	ファーストビュー設定
	
	**********************************/
	.top_img_flame{
		background-image: none;
		height: auto;
		margin-top: -11vw;
	}
	
	.top_img_in{
		width: 100%;
	}
	
	.top_img_in img{
		width: 100%;
		height: calc(100vh - 13vw);
		min-height: 400px;
		object-fit: cover;
	}
	
	
	/**********************************
	
	section設定
	
	**********************************/
	.section_under_flame{
		padding: 10vw 0;
	}
	
	.big_under,.tokuchou_under,.salon_under,.kyuujin_under,.insta_under{
		padding-top: 14vw;
		padding-bottom: 15vw;
	}
	
	
	/**********************************
	
	トップ下エリア
	
	**********************************/
	.top_shita_over{
		background-image: none;
		background-color: #F7F7F7;
	}
	
	.top_shita_under{
		padding-top: 10vw;
	}
	
	.top_shita_h2_ue_text{
		font-size: 3.6vw;
	}
	
	.top_shita_under h2{
		font-size: 6.3vw;
		margin-top: 1vw;
	}
	
	
	.top_shita_text{
		font-size: 4.2vw;
		line-height: 7.2vw;
		width: 100%;
		padding: 5vw !important;
		white-space: pre-wrap;
		margin-top: 0 !important;
	}
	
	
	
	
	
	
	/**********************************
	
	特徴エリア
	
	**********************************/
	
	
	
	.tokuchou_under h2,.service_under h2,.price_under h2,.salon_under h2,.kyuujin_under h2,.insta_under h2{
		font-size: 8.6vw;
	}
	
	
	
	.tokuchou_retu{
		display: block;
		padding-top: 0 !important;
	}
	
	.tokuchou_oosoto_flame{
		width: 100%;
		padding-top: 8vw;
	}
	
	.tokuchou_icon{
		width: 17%;
		margin: 0 auto -10.8vw;
	}
	
	.tokuchou_uchi_flame{
		padding: 11.5vw 4.2vw 5vw;
	}
	
	.tokuchou_uchi_flame h3{
		font-size: 5.6vw;
	}
	
	.tokuchou_uchi_flame h3 span{
		font-size: 8.6vw;
	}
	
	.tokuchou_uchi_flame p{
		font-size: 4.2vw;
	}
	
	
	
	
	/**********************************
	
	内装エリア
	
	**********************************/

	
	.naisou_under{
		display: block;
	}
	
	.naisou_img1{
		width: 100%;
		height: auto;
		display: block;
		margin: 0 auto 5vw;
	}
	
	.naisou_text_flame{
		width: 100%;
	}
	
	.naisou_under h2{
		font-size: 6.3vw;
		margin-top: 1vw !important;
	}
	
	.naisou_text{
		font-size: 4.2vw;
		line-height: 7.2vw !important;
	}
	
	.naisou_text_flame img{
		margin-top: 8vw;
	}
	
	
	
	
	
	/**********************************
	
	サービスエリア
	
	**********************************/

	
	.title_sub_text{
		font-size: 4vw;
	}
	
	.title_sub_text span{
		font-size: 7vw;
	}
	
	.service_under .title_sub_text,.price_under .title_sub_text{
		margin-top: 3vw !important;
	}
	
	.pc_service_hyou{
		display: none !important;
	}
	
	.sp_service_hyou{
		display: flex !important;
	}
	
	.service_under ul li{
		width: 38vw;
		height: 32vw;
		margin-top: 1vw;
		margin-right: 0;
		font-size: 4vw;
		padding-top: 22vw;
	}
	
	.serice1,.serice3,.serice5,.serice7{
		margin-right: 1vw !important;
	}
	
	.serice1,.serice2{
		margin-top: 10vw !important;
	}
	
	.serice6{
		background-position: center top 6.5vw;
	}
	
	.serice8{
		padding-top: 18.5vw !important;
		background-position: center top 4vw;
	}
	
	.serice7,.serice8{
		margin-bottom: 10vw;
	}
	
	
	
	
	/**********************************
	
	料金エリア
	
	**********************************/
	
	
	.price_retu1{
		margin-top: 8vw;
	}
	
	.price_retu{
		display: block;
	}
	
	.price_oosoto_flame{
		width: 100%;
		margin-top: 10vw;
	}
	
	.price_oosoto_flame_top{
		margin-top: 0 !important;
	}
	
	.price_h3_flame{
		padding: 1.5vw;
	}
	
	.price_h3_flame h3{
		padding: 3vw 0;
	}
	
	.price_h3_flame h3 p{
		font-size: 4.6vw;
	}
	
	.price_text_flame p{
		font-size: 4.2vw;
	}
	
	.price_text_flame p span{
		font-size: 7.4vw;
	}
	
	.plus{
		font-size: 7vw;
		margin-top: 4vw !important;
		margin-bottom: 4vw !important;
	}
	
	.left_triangle{
		border-top: 1vw solid transparent;
		border-right: 1.4vw solid #DBBE2F;
		border-bottom: 1vw solid transparent;
		margin-left: 1.6vw;
		
	}
	
	.kangen_text{
		padding: 2vw 2vw 1vw!important;
		
	}
	
	.kangen_text span{
		font-size: 6.4vw !important;
	}
	
	.price_text_flame{
		padding: 11.5vw 0;
		margin-bottom: 1vw;
	}
	
	.price_bottom_text{
		font-size: 4.2vw;
		padding: 3.6vw 0 !important;
	}
	
	.price_retu2{
		margin-top: 0;
	}
	
	.price_text_flame6{
		height: 37vw;
	}
	
	
	
	/*******シュミレーション表***********/
	
	
	.hyou_under{
		padding-top: 0;
		padding-bottom: 17vw;
	}
	
	.hyou_under table tbody tr th, .hyou_under table tbody tr td{
		width: 20vw;
		font-size: 3vw;
		padding: 3vw 0;
	}
	
	.hyou2{
		margin-top: 10vw;
	}
	
	
	
	.ue_hyou{
		margin-bottom: 10vw;
	}
	
	
	
	.uriage{
		width: 19.2vw;
		font-size: 3.4vw;
	}
	
	.kingaku{
		width: 75.7vw;;
		font-size: 3.4vw;
	}
	
	
	/**********************************
	
	サロンエリア
	
	**********************************/
	
	.share_salon_inner{
		margin-top: 10vw;
		display: block;
	}
	
	.share_salon_img{
		width: 100%;
		height: auto;
	}
	
	.salon_logo{
		margin: 10vw auto 6vw;
		display: block;
		width: 60%;
		height: auto;
	}
	
	.salon_under dl dt, .salon_under dl dd{
		font-size: 4.2vw;
	}
	
	.salon_under dl dt{
		width: 23vw;
	}
	
	
	
	.salon_under iframe{
		width: 100%;
		height: 75vw;
		margin-top: 10vw;
	}
	
	
	
	/**********************************
	
	求人エリア
	
	**********************************/
	
	
	.kyuujin_under .title_sub_text{
		margin-top: 6vw !important;
		line-height: 7vw !important;
	}
	
	.kyuujin_under iframe{
		width: 100%;
		height: 53vw;
		margin-top: 8vw;
	}
	
	
	
	
	
	/**********************************
	
	インスタエリア
	
	**********************************/
	
	.insta_inner{
		margin-top: 8vw;
		display: block;
		padding: 12vw 8vw;
	}
	
	.insta_flame{
		width: 100%;
		margin-top: 15vw;
	}
	
	.insta_flame_top{
		margin-top: 0 !important;
	}
	
	.insta_text{
		font-size: 4.2vw;
		line-height: 7vw !important;
		padding: 2vw 0 !important;
	}
	
	.insta_flame a{
		font-size: 5vw;
		padding: 4vw 0;
	}
	
	/**********************************
	
	footerエリア
	
	**********************************/
	.footer{
		padding-bottom: 13vw;
	}
	
	.footer_under{
		display: block;
	}
	
	.footer_logo{
		display: block;
		margin: 0 auto 8vw;
		width: 60%;
		height: auto;
	}
	
	.footer_menu{
		font-size: 3.6vw;
		line-height: 12vw;
		margin-right: 5vw !important;
	}
	
	.footer_menu_shita{
		margin-top: 0;
	}
	
	.footer_menu_last{
		margin-right: 0 !important;
	}
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
}