@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700;900&display=swap&subset=japanese');

/*------------------- reset ---------------------------------------*/

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}


/*--------------- common -----------------------*/


/*------------------ general----------------*/


.mt0   { margin-top:  0px !important ; }
.mt5   { margin-top:  5px !important ; }
.mt10  { margin-top: 10px !important ; }
.mt15  { margin-top: 15px !important ; }
.mt20  { margin-top: 20px !important ; }
.mt25  { margin-top: 25px !important ; }
.mt30  { margin-top: 30px !important ; }
.mt35  { margin-top: 35px !important ; }
.mt40  { margin-top: 40px !important ; }
.mt45  { margin-top: 45px !important ; }
.mt50  { margin-top: 50px !important ; }

.mb0   { margin-bottom:  0px !important ; }
.mb10  { margin-bottom: 10px !important ; }
.mb15  { margin-bottom: 15px !important ; }
.mb20  { margin-bottom: 20px !important ; }
.mb25  { margin-bottom: 25px !important ; }
.mb30  { margin-bottom: 30px !important ; }
.mb35  { margin-bottom: 35px !important ; }
.mb50  { margin-bottom: 50px !important ; }
.mb60  { margin-bottom: 60px !important ; }

.mr0 { margin-right: 0px !important;}
.mr10 { margin-right: 10px !important;}
.mr20 { margin-right: 20px !important;}
.mr30 { margin-right: 30px !important;}
.mr40 { margin-right: 40px !important;}

.pl0{ padding-left: 0px !important;}
.pl10{ padding-left: 10px !important;}
.pl20{ padding-left: 20px !important;}
.pl30{ padding-left: 30px !important;}
.pl40{ padding-left: 40px !important;}
.pl50{ padding-left: 50px !important;}

.pb0{ padding-bottom: 0px !important;}
.pb10{ padding-bottom: 10px !important;}
.pb20{ padding-bottom: 20px !important;}
.pb30{ padding-bottom: 30px !important;}
.pb40{ padding-bottom: 40px !important;}


.pr0{padding-right: 0px !important;}
.pr10{padding-right: 10px !important;}
.pr15{padding-right: 15px !important;}
.pr20{padding-right: 20px !important;}
.pr30{padding-right: 30px !important;}
.pr40{padding-right: 40px !important;}

.pt0{ padding-top: 0 !important;}
.pt10{ padding-top: 10px !important;}
.pt20{ padding-top: 20px !important;}
.pt30{ padding-top: 30px !important;}
.pt40{ padding-top: 40px !important;}

body {
	font-size: 100%;
	background-color: #fff;
	color: #000;
	font-family: 'Noto Sans JP', sans-serif;
	-webkit-text-size-adjust: 100%;
}
h1,h2,h3,h4,h5,h6{
	font-weight:normal;
	margin: 0;
	padding: 0;
}

img{
	display: block;
	max-width: 100%;
}

*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}
html,body{
	width: 100%;
	min-width: 1100px;
	overflow-x: hidden;
}
html{ font-size:62.5%;}

body {
	font-size: 1.0rem;
	line-height: 1.75;
	position: relative;
}

.tab,
.sp,
.ip{
	display:none;
}

.wrap{
	width: 1024px;
	max-width: 100%;
	margin: auto;
}

a{
	text-decoration: none;
	outline:none;
	transition: 0.3s ease;

}

a:hover{
	text-decoration:none;
}
a:hover img{
	opacity: 0.7;
}
a:hover{
	opacity: 0.7;
}

.switch{
	display: none;
}
.flex{
	display: flex;
}
.bold{
	font-weight: bold;
}
.y_line{
	position: relative;
	background: linear-gradient(transparent 50%, #FFF500 50%);
}
.txt-red{
	color: #ED1B2E;
}
.ttl01{
	font-size: 3rem;
	text-align: center;
	font-weight:900;
	color: #fff;
	background-color: #009843;
	border-radius: 34px;
	height: 67px;
	padding: 9px 0 0;	
}
.ttl02{
	text-align: center;
	font-size: 3rem;
	font-weight: bold;
	color: #009843;
	line-height: 1.73;
}
.ttl03{
	position: relative;
	background-color: #009843;
	font-size: 3.2rem;
	font-weight: 900;
	color: #fff;
	text-align: center;
	height: 96px;
	border-radius: 20px;
	padding: 20px 0 0;
}
.ttl03::after{
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 36px 20px 0 20px;
	border-color: #009842 transparent transparent transparent;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: -36px;

}
.ttl03 span{
	font-size: 2.4rem;
	font-weight: bold;
}

.btn01{
	width: 643px;
	margin: auto;
	height: 62px;
	max-width: 100%;
}
.btn01 a{
	display: block;
	border-radius: 31px;
	width: 100%;
	height: 100%;
	font-size: 2.4rem;
	font-weight: 900;
	color: #fff;
	background-color: #ED1B2E;
	text-align: center;
	padding: 10px 0 0;
}
.g_box{
	border: 8px solid rgba(0,152,67,.5);
}
.bar_txt{
	font-size: 3.2rem;
	font-weight: 900;
	color: #fff;
	text-align: center;
	background-color: #009843;
	height: 83px;
	padding: 12px 0 0;
}
	
/*---------------- sp-------------------*/

@media screen and (max-width:768px){
	
	html,body{
		width: 100%;
		min-width: inherit;
	}
	
	
	.sp{
		display: block;
	}
	.pc {
		display: none;
	}

	.wrap{
		width: 100%;
		padding: 0 4.8%;
	}
	
}

/*------------------- IE11 -------------------*/
_:-ms-lang(x)::-ms-backdrop,
#aaa{
	margin-top: 25px;
}
/*------------------ safari -------------------*/
_::-webkit-full-page-media, _:future, :root 
#aaa{
    width: 106px;
}



/*--------------------------- header -----------------------*/


#header{
	border-top: 6px solid #009843;
	padding: 18px 0 30px;
}
#header .inner{
	width: 1365px;
	margin: auto;
	max-width: 100%;
	padding: 0 25px;
	
}


/*---------------------- main -----------------------*/


#mv{
	padding: 0 0 45px;
}

.greeting_box{
	border: 4px solid #009843;
	position: relative;
	width: 860px;
	max-width: 100%;
	margin: auto;
	text-align: center;
	padding: 26px 0 33px;
}
.greeting_box .gimg{
	position: absolute;
}
.greeting_box .gimg01{
	width: 139px;
	left: -78px;
	top: 115px;

}
.greeting_box .gimg02{
	width: 166px;
	right: -82px;
	bottom: 135px;
}

.greeting_box .adj{
	width: 150px;
	display: inline-block;
}

.greeting_box .txt01{
	font-size: 2.8rem;
	font-weight: 900;
	color: #009843;
	margin: 0 0 28px;
}
.greeting_box .txt{
	font-size: 2.4rem;
	font-weight: bold;
	line-height: 1.4;
}
.greeting_box .txtbig{
	font-size: 2.8rem;
	color: #009843;
}
.greeting_box .pc_box{
	text-align: left;
	margin-top: 2em;
	display: flex;
	justify-content: center;
}
.greeting_box .gimg03{
	width: 123px;
	display: block;
	position: relative;
	top: -12px;
	margin-right: 10px;
}

.cam_ttl{
	margin: 0 0 25px;
}
.campaign .notice{
	text-align: right;
	font-size: 1.6rem;
	background-image: url("../images/cam_arr.png");
	background-repeat: no-repeat;
	background-position: center top;
	height: 49px;
}
.driveth{
	padding: 22px 0 0;
}
.d_box{
	border: 8px solid #009843;
	background-color: #FFFCF0;
	position: relative;
	margin: 25px 0 0;
	padding: 0 0 33px;
}
.d_ttl{
	font-size: 3rem;
	color: #fff;
	font-weight:700;
	background-color: #009843;
	padding: 9px 20px 5px;
	text-align: left;
}
.d_ttl span{
	font-size: 3rem;
}
.d_ttl .big{
	font-weight: 900;
	color: #FFF500;
	font-size: 4rem;
}
.d_img{
	position: absolute;
	top: -39px;
	right: 18px;
}
.d_box_inn{
	display: flex;
	padding: 30px 0 60px 0;
}
.d_box_inn .img_box{
	width: 440px;
	max-width: 100%;
}
.d_box_inn .cnt_box{
	width: calc( 100% - 440px);
	padding: 26px 0 0 42px;
}
.d_box_inn .cnt_box p{
	font-size: 2.4rem;
	font-weight: bold;
}
.d_box .d_btn{
	margin: 45px auto auto;
}

/*--------------------- osusume --------------------*/

.osusume{
	padding: 40px 0 0;
}

.osusume .ttl01{
	margin: 0 0 15px;
	border-radius: 0;
	
}
.osusume_box{
	display: flex;

	margin: 25px 70px auto;
}
.osusume_box .img_box{
	width: 270px;
	max-width: 100%;
}
.osusume_box .cnt_box{
	width: calc( 100% - 270px);
	padding: 0 0 0 0;
}
.osusume_box .cnt_box p{
	font-size: 2.2rem;
	font-weight: bold;
	line-height: 1.75;
}
.tire_check{
	width: 500px;
	max-width: 100%;
	margin: auto;
}

/*------------------------- torikumi ---------------------*/

.torikumi{
	padding: 120px 0 0;
}
.torikumi .wrap{
	background-image: url("../images/torikumi_bg.png");
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: 100%;
}
.torikumi img{
	margin: auto;
}
.torikumi .txt01{
	font-size: 2.4rem;
	font-weight: bold;
	margin: 25px 0 0 70px;
}
.torikumi .txt02{
	font-size: 4.8rem;
	font-weight: 900;
	color: #009843;
	line-height: 1.47;
	margin: 0 0 0 70px;
}
.torikumi .ttl03{
	margin-top: 58px;
}


/*------------------- denwa -------------------*/

.denwa{
	padding: 20px 0 0;
}
.denwa_box{
	padding: 30px 25px 42px;
}
.denwa_flex{
	display: flex;
	padding: 0 0 45px;
}
.denwa_box .img_box{
	width: 335px;
	max-width: 100%;
}
.denwa_box .cnt_box{
	width: calc( 100% - 335px);
	padding: 0 0 0 37px;
	max-width: 100%;
}
.denwa_box .cnt_box p{
	font-size: 2.4rem;
	font-weight: bold;
	line-height: 1.37;
}

/*--------------------- takeout -------------------*/

.takeout{
	padding: 40px 0 0;
}
.takeout_box{
	margin-top: 20px;
	padding: 25px 20px 28px 25px;
}
.takeout_flex{
	display: flex;
}
.takeout_flex .img_box{
	width: 335px;
	max-width: 100%;
}
.takeout_flex .cnt_box{
	width: calc( 100% - 335px);
	padding: 0 0 0 20px;
}

.takeout .txt01{
	font-size: 3rem;
	font-weight: 900;
	text-align: center;
	color: #009843;
	background-color: #FFF500;
	
}
.takeout .txt02{
	font-size: 5rem;
	font-weight: bold;
	margin: 18px 0 8px;
}
.takeout .txt02 span{
	font-size: 8rem;
	font-weight: 900;
	color: #009843;
	background: linear-gradient(transparent 60%, #FFF500 40%);
}
.takeout .txt03{
	font-size: 2.1rem;
	font-weight: bold;
	line-height: 1.37;
}
.takeout .txt04{
	margin-top: 25px;
}

/*------------------------- measure -------------------*/

.measure{
	padding: 65px 0 0;
}

.measure_box{
	border: 10px solid #009843; 
	border-radius: 50px;
	background-color: rgba(0,152,67,.04);
	padding: 45px 30px 55px;
}

.measure .txt01{
	font-size: 7.2rem;
	color: #009843;
	text-align: center;
	line-height: 1.4;
	font-weight: bold;
}
.measure .txt01 span{
	font-size: 9rem;
	font-weight: 900;
}
.measure .m_list{
	display: flex;
	justify-content: center;
	margin: 50px 0 45px;
}
.measure .m_list li + li{
	margin-left: 40px;
}
.measure .txt02{
	font-size: 2.4rem;
	font-weight: bold;
	line-height: 1.37;
	text-align: center;
	margin: 0 0 82px;
}

/*-------------------app ----------------------*/

.app .app_box{
	background-color: #fff;
}
.app .txt01{
	font-size: 3.6rem;
	margin-bottom: 25px;
}
.app .app_link{
	display: flex;
	justify-content: center;
	margin: 65px 0 55px;
}
.app .app_link a{
	width: 300px;
}
.app .app_link a + a{
	width: 352px;
	margin-left: 45px;
}
.app .txt02{
	font-size: 3rem;
	color: #ED1B2E;
	line-height: 1.6;
}
.app .off{
	width: 800px;
	max-width: 100%;
	margin: auto auto 60px;
}

/*------------------- support -----------------*/

.support{
	padding: 85px 0 0;
}

.support .txt01{
	text-align: center;
	color: #009843;
	font-size: 4.4rem;
	font-weight: 900;
	
}
.support .notice{
	text-align: right;
	font-size: 1.6rem;
	position: relative;
	top: -25px;
}
.f_logo{
	padding: 55px 0 80px;
	text-align: center;
}
.f_logo a{
	display: inline-block;
}
.f_logo img{
	margin: auto;
}



/*------------------------- footer --------------------*/

#footer{
	background-color: #009843;
	color: #fff;
	padding: 5px 0 8px;
}
#footer .cpy{
	font-size: 1.4rem;
	text-align: center;
}

/*------------------------------- sp ----------------------------*/



@media screen and (max-width: 768px) {
	
	.ttl01{
		border-radius: 0;
		height: auto;
		font-size: 2.8rem;
		line-height: 1.4;
		padding: 4px 0 15px;
	}
	.ttl02{
		font-size: 2.3rem;
		line-height: 1.5;
		padding: 0 15px;
	}
	.ttl03{
		height: auto;
		font-size: 3rem;
		line-height: 1.3;
		padding: 15px 0 20px;
		border-radius: 0;
		width: 100%;
	}
	.ttl03 span{
		font-size: 2.2rem;
	}
	.ttl03::after{
		border-width: 27px 15px 0 15px;
		bottom: -27px;
	}
	.btn01{
		width: 90%;
		max-width: 643px;
		height: 70px;
	}
	.btn01 a{
		border-radius: 40px;
		font-size: 1.8rem;
		padding: 0 0 0;
		line-height: 1.3;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.bar_txt {
		font-size: 1.8rem;
		height: auto;
		padding: 14px 0 15px;
		line-height: 1.45;
	}
	
	#header{
		padding: 15px 0 20px;
	}
	
	#header .inner{
		padding: 0 4.8%;
	}
	#mv{
		padding-bottom: 20px;
	}

	#mv .wrap{
		padding: 0;
	}
	.greeting_box .txt01{
		font-size: 2.2rem;
		line-height: 1.5;
	}
	.greeting_box .txt{
		font-size: 1.7rem;
	}
	.greeting_box .gimg01 {
		width: 45px;
		left: -4vw;
		top: 127px;
	}
	.greeting_box .gimg02 {
		width: 57px;
		right: -4vw;
		bottom: 203px;
	}
	.greeting_box .gimg03 {
		width: 65px;
		top: auto;
	}
	.greeting_box .pc_box{
		display: none;
	}
	.greeting_box .sp_box{
		display: flex;
		justify-content: center;
		margin-top: 2em;
	}
	.greeting_box .txtbig{
		font-size: 1.7rem;
	}

	.campaign .wrap{
		padding: 0;
	}
	.cam_ttl{
		margin-bottom: 30px;
	}
	.campaign .notice{
		font-size: 1.1rem;
		background-size: 43px;
	}
	.driveth{
		padding: 0;
	}
	.driveth .wrap{
		padding: 0;
	}
	.d_ttl{
		font-size: 2.1rem;
		line-height: 1.3;
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 17px 0 19px;
		border-radius: 0;
	}
	.d_ttl .big{
		font-size: 2.3rem;
	}
	.d_img{
		position: static;
		width: 90px;
	}
	.d_box{
		padding-bottom: 30px;
		margin-top: 0;
	}
	.d_box_inn{
		display: block;
		padding: 35px 40px;
	}
	.d_box_inn .img_box{
		margin: auto;
	}
	.d_box_inn .cnt_box{
		width: 100%;
		padding: 15px 0 0;
		display: flex;
		justify-content: center;
	}
	.d_box_inn .cnt_box p{
		font-size: 1.6rem;
		line-height: 1.5;
	}
	.d_box .d_btn{
		margin-top: 10px;
	}
	.osusume .wrap{

	}
	.osusume_box{
		padding: 0 13px;
		flex-direction: column-reverse;
		margin:auto auto 50px;
	}
	.osusume .ttl01{
		margin-bottom: 20px;
		font-size: 2.8rem;
	}
	.osusume_box .img_box {
		width: 72%;
		max-width: 336px;
		margin: auto;
	}
	.osusume_box .cnt_box{
		width: 100%;
		margin-top: 25px;
	}
	.osusume_box .cnt_box p{
		font-size: 1.5rem;
		letter-spacing: -0.1em;
		line-height: 1.56;
	}
	.torikumi{
		padding-top: 50px;
	}
	.torikumi .wrap{
		background-image: url("../images/torikumi_bg_sp.png");
		background-size: 90.4%;
		background-position: center bottom;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		padding: 0;
	}
	.torikumi_img01{
		padding: 0 4.8%;
	}
	.torikumi .txt01{
		margin: 20px 10px auto;
		font-size: 1.6rem;
	}
	.torikumi .txt02{
		margin: 0 10px;
		font-size: 2.9rem;
		line-height: 1.46;
	}
	.torikumi .ttl03{
		margin-top: 0;
	}
	
	.denwa{
		padding-top: 10px;
	}
	.denwa_box {
		padding: 13px 13px 25px;
	}
	.denwa_flex{
		display: block;
		padding-bottom: 30px;
	}
	.denwa_box .img_box{
		max-width: 300px;
		margin: auto;
		width: 100%;
	}
	.denwa_box .cnt_box{
		width: 100%;
		padding: 0;
		margin-top: 25px;
	}
	.denwa_box .cnt_box p{
		font-size: 1.4rem;
		margin-top: 15px;
	}
	.takeout .ttl03{
		font-size: 2.8rem;
	}
	.takeout .ttl03 span{
		font-size: 2rem;
	}
	.takeout_box {
		margin-top: 10px;
		padding: 15px 15px 15px;
	}
	.takeout_flex{
		display: block;
	}
	.takeout_flex .img_box {
		max-width: 335px;
		width: 100%;
		margin: auto;
	}
	.takeout_flex .cnt_box{
		padding: 0;
		width: 100%;
	}
	.takeout .txt01{
		font-size: 1.8rem;
		padding: 5px 0 6px;
	}
	.takeout .txt02{
		font-size: 4.4rem;
		text-align: center;
		line-height: 1.2;
		margin: 12px 0 19px;
	}
	.takeout .txt02 span{
		font-size: 5.8rem;
	}
	.takeout .txt03{
		font-size: 1.6rem;
	}
	.measure {
		padding: 50px 0 0;
	}
	.measure_box{
		border-radius: 35px;
		padding: 28px 15px 30px;
		border-width: 8px;
	}
	.measure .txt01{
		font-size: 2.8rem;
		line-height: 1.3;
	}
	.measure .txt01 span{
		font-size: 3.7rem;
		
	}
	.measure .m_list{
		display: block;
		margin: 20px 0 30px;
	}
	.measure .m_list li{
		width: 67%;
		max-width: 218px;
		margin: auto;
	}
	.measure .m_list li + li{
		margin: 18px auto 0;
	}
	.measure .txt02{
		font-size: 1.6rem;
		text-align: left;
		margin: 0 0 25px;
	}
	.app .txt01{
		font-size: 2rem;
		line-height: 1.4;
	}
	.app .app_link{
		display: block;
		margin: 30px auto;
	}
	.app .app_link a,
	.app .app_link a + a{
		width: 91%;
		margin: auto;
		display: block;
	}
	.app .app_link a + a{
		margin-top: 30px;
	}
	.app .txt02{
		font-size: 1.6rem;
		text-align: center;
	}
	.app .off{
		margin: auto auto 35px;
	}
	.app .btn01{
		width: 100%;
	}
	.support {
		padding: 25px 0 0;
	}
	.support .wrap{
		padding: 0;
	}
	.support .txt01{
		font-size: 2.6rem;
		line-height: 1.5;
	}
	.support .notice{
		position: static;
		text-align: center;
		font-size: 1.1rem;
		margin-top: 10px;
	}
	.f_logo {
		max-width: 300px;
		margin: auto;
		width: 72%;
		padding: 35px 0 30px;
	}
	#footer .cpy{
		font-size: 1.1rem;
	}
}
@media screen and (max-width: 425px) {

	


}
@media screen and (max-width: 360px) {
	.d_img{
		width: 80px;
	}
	.d_box_inn .cnt_box p{
		font-size: 1.5rem;
	}
	.torikumi .txt02{
		font-size: 2.7rem;
	}
	.takeout .txt02 span{
		font-size: 5.5rem;
	}
	.measure .txt01 span{
		font-size: 3.5rem;
	}
	.osusume_box .cnt_box p{
		font-size: 1.4rem;
	}
	

}