@charset "utf-8";
/*==================================================
	スマホのみに適用
==================================================*/
@media only screen and (max-width: 640px){
	body { font-size: 85%; }
	.dsp_hp, .dsp_hpt { display: none; }

	/* ヘッダ */
	#header {
		height: 60px;
	}
	#header .flag {
		position: relative;
	}
	#header .flag p {
		height: 50px;
		width: 40px;
		line-height: 40px;
		font-size: 16px;
		padding-bottom: 5px;
		top: 0;
	}
	#header.box_flex_sp {
		/*justify-content: flex-start;*/
	}
	#header h1.title {
		display: block;
		padding-left: 0;
		padding-top: 0;
		margin-left: 5px;
	}
	#header h1.title img {
		position: relative;
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
		max-height: 36px;
	}
	@media only screen and (max-width: 320px) {
		#header h1.title img {
			width: 220px;
		}
	}
	/*無料相談*/
	#header .tel_smt img {
		max-height: 36px;
		position: relative;
		right: 5px;
	}
	
	/* LINE */
	#header .line {
		width: 39px;
		padding: 0 8px;
		top: 0;
		right: 0;
		background: #00a63b;
		/*background: #06C755;*/
		height: 60px;
		line-height: 60px;
	}
	#header .contact {
		width: 100%;
		display: block;
		position: relative;
		right: 0;
	}
	#header .contact .txt {
		width: 100%;
		margin-top: 0;
		font-size: 16px;
		line-height: 25px;
	}
	#header .contact .tel {
		text-align: center;
	}
	/* コンテナ */
	#wrap, #footer {
		min-width: 320px;
	}
	#container {
		padding-top: 0px;
	}
	#container h3.sub {
		margin-bottom: 20px;
		font-size: 18px;
	}
	#container h3.sub02 {
		font-size: 14px;
	}
	#container h3.sub03 {
		font-size: 25px;
		margin-bottom: 15px;
	}
	/* フッター */
	#footer {
		margin-bottom: 19vw;
	}
	#footer .contact .tel a {
		font-size: 30px;
	}
	#footer .box dt img {
		max-width: 250px;
	}
	#copyright {
		height: auto;
		line-height: 1.6;
		padding: 5px 0;
	}
	/* 枠のマージン・パディング */
	.mb { margin-bottom: 30px; }
	.pt { padding-top: 30px; }
	.pb { padding-bottom: 30px; }
	.main {
		padding: 0;
	}
	.main_smt{
		padding-left: 15px;
		padding-right: 15px;
	}
	/*--------------------------------------------------
		トップページ
	--------------------------------------------------*/
	#time_box {
		line-height: 1.8em;
		padding: 15px;
		font-size: 16px;
		margin-top: 25px;
	}
	#time_box span {
		font-size: 18px;
	}
	#top_area::before {
		width: 75px;
	}
	#top_area .area_box .txt_img  {
		width: 160px;
	}
	#top_area .area_box .txt {
		font-size: 18px;
		line-height: 1.8em;
		margin: 10px 0 20px;
	}
	#top_area .area_box .txt span {
		font-size: 25px;
	}
	#top_area .area_box .wrap p {
		width: 32%;
		line-height: 2;
		font-size: 17px;
	}
	#top_area .area_box .in {
		padding: 15px;
	}
	#top_area .area_box .in .area_flex li {
		width: 48%;
		line-height: 35px;
		padding-bottom: 1px;
		font-size: 16px;
	}
	/*CTA*/
	.cta_box {
		padding: 10px;
	}
	.cta_box p .txt {
		font-size: 13px;
	}
	
	#top_card .box h3.sub02 {
		top: -15px;
	}
	#top_contents .in {
		padding: 5px;
	}
	#top_contents .in .in_box {
		padding: 15px;
	}
	#top_contents .in .in_box .ttl {
		font-size: 25px;
		margin-bottom: 5px;
	}
	#top_contents .in .in_box .price {
		font-size: 18px;
	}
	#top_contents .in .in_box .price::before {
		top: auto;
		background: url(../img/top/price-bg.png) no-repeat bottom center / contain;
		width: 100%;
		height: 100px;
	}
	#top_contents .in::before {
		width: 80px;
		height: 80px;
		right: -10px;
	}
	#top_contents .in .in_box li {
		font-size: 16px;
		padding-left: 30px;
		line-height: 60px;
	}
	#top_contents .in .in_box li::before {
		background: url(../img/top/check.png) no-repeat top center / 100%;
		width: 30px;
		height: 100%;
		top: 15px;
	}
	#top_contents .in .in_box li:last-of-type {
		margin-bottom: 0;
	}
	#top_voice .txt_img,
	#top_faq .txt_img {
		width: 160px;
		margin-bottom: 20px;
	}
	#top_voice dl {
		display: block;
		padding: 15px;
	}
	#top_voice dl:last-of-type {
		margin-bottom: 0;
	}
	#top_voice dt {
		left: auto;
		top: auto;
		text-align: center;
		margin-bottom: 15px;
	}
	#top_voice dt img {
		width: 110px;
	}
	#top_voice dd {
		width: 100%;
	}
	#top_voice dd .txt b {
		font-size: 16px;
		line-height: 1.8em;
	}
	#top_voice dd .txt {
		font-size: 14px;
	}
	#top_voice dd .txt_s {
		font-size: 13px;
		line-height: 1.8em;
	}
	#top_faq dt {
		line-height: 1.8em;
		font-size: 16px;
	}
	#top_faq dt b {
		width: 90%;
	}
	#top_faq dd {
		font-size: 14px;
	}
	#top_faq dd span.maru {
		font-size: 16px;
	}
	
	/*特定商取引法に関する記述*/
	#top_sct .txt_img {
		width: 285px;
		margin-bottom: 20px;
	}
	#top_sct dl {
		margin: 0;
	}
	
	/*トラブル*/
	#trouble ul {
		font-size: 15px;
		padding-left: 35px;
		margin-bottom: 20px;
	}
	#trouble p.ari {
		font-size: 20px;
		margin-bottom: 40px;
	}
	
	/*安さの秘密*/
	#secret .txt_img {
		width: 230px;
		margin-bottom: 20px;
	}
	#secret .che {
		font-size: 22px;
	}
	#secret dl {
		width: 90%;
		margin: 0 auto 5px;
		font-size: 16px;
		padding: 5px 10px;
	}
	#secret dl dt {
		width: 100px;
	}
	
	/*キャンペーン*/
	#campaign {
		padding: 10px;
	}
	#campaign .big {
		font-size: 31px;
	}
	#campaign .big span {
		font-size: 35px;
	}
	#campaign .age {
		font-size: 17px;
	}
	#campaign .big span.mini {
		font-size: 25px;
	}
	#campaign .big span.yell {
		font-size: 33px;
	}
	#campaign .age span.yell {
		font-size: 22px;
	}
	#campaign img.img {
		width: 54px;
	}
	
/*------------------------------------------------*/
}
