@charset "utf-8";

/*============================================================
	乗りほ〜DAY　基本
============================================================ */
/*
layout.css
color:#222222;
point color2:#00aebb
point color3:#e60020

/*----------------------------------------------
RESPONSIVE
------------------------------------------------*/

@media screen and (max-width: 767px) {
.pconly	{
display:none !important;
}
}

/*   ----------------------------*/
@media (min-width: 766px) {
.smaonly{
display:none;
}
}

/*   ------------------------------*/
@media screen and (max-width: 767px) {
.max767{
display:none !important;
}
}

/*   ------------------------------*/
@media (min-width: 768px) {
.min768{
display:none !important;
}
}




/*--------------------------------------------------
TOP
--------------------------------------------------*/

/* BASIC
--------------------------------------------------*/

/* -------　base  -------*/
body{
margin:0;
padding:0;
color:#222222;
letter-spacing:0.08em;
}

/* ------　link img ------*/
a:active img ,
a:hover img {
outline: 0;
opacity: 0.6;
}



/* ALL CONTENS
------------------------------------------------------*/

#all{
width: 100%;
margin-left: auto;
margin-right:auto;
position: relative;
}


/* MAIN IMG BASE
--------------------------------------------------------*/
#topmain-img {
position:relative;
width:calc(100vw - var(--scrollbar));
min-height:100vh;
margin-top:50px;
background-image:
url("../img/index/catch.png"),
url("../img/index/main_img_lo.jpg");
background-repeat:
no-repeat,
no-repeat;
background-position:
top 180px left 40px,
top center;
background-size:
330px,
cover;
}
/* ------　06 ------*/
@media (min-width: 1500px)  {
#topmain-img {
background-image:
url("../img/index/catch.png"),
url("../img/index/main_img_lo.jpg");
background-repeat:
no-repeat,
no-repeat;
background-position:
top 340px left 90px,
top center;
background-size:
430px,
cover;
}
}
/* ------　02 ------*/
@media (max-width: 1080px) {
#topmain-img {
margin-top:0px;
background-image:
url("../img/index/catch.png"),
url("../img/index/main_img.jpg");
background-repeat:
no-repeat,
no-repeat;
background-position:
top 150px left 20px,
top center;
background-size:
300px,
cover;
}
}
/* ------　03 ------*/
@media (max-width: 910px) {
#topmain-img {
margin-top:34px;
background-image:
url("../img/index/catch.png"),
url("../img/index/main_img.jpg");
background-repeat:
no-repeat,
no-repeat;
background-position:
top 120px left 30px,
top center;
background-size:
240px,
cover;
}
}
/* ------ 04 -----*/
@media (max-width: 684px) {
#topmain-img {
background-image:
url("../img/index/catch.png"),
url("../img/index/main_img.jpg");
background-repeat:
no-repeat,
no-repeat;
background-position:
top 220px left 40px,
top center;
background-size:
220px,
cover;
}
}
/* ------ 05 ------*/
@media (max-width: 683px){
#topmain-img {
margin-top:34px;
background-image:
url("../img/index/main_img_s.jpg");
background-position:
top center;
background-size:
cover;
}
}


/* TOP INFO
--------------------------------------------------------*/
.top-info {
max-width: 1080px;
margin: 50px auto 30px;
padding:25px 26px 20px;
background-color: #CDEBEE;
border-radius: 24px;
}
.catego{
max-width: 640px;
margin: 0px auto 10px;
text-align: center;
}

/* ------ HEADLINE ------ */
.top-info .list_info {
width: 100%;
}

.top-info .list_info li {
margin: 0 0 10px 0;
}

.list_info li {
display: flex;
margin: 0 0 15px 0;
}

.list_info li:last-child {
	margin-bottom: 0;
}

.list_info .cate,
.list_info .date,
.list_info .title {
	display: block;
 padding:10px 14px 10px 20px;
	background: #ffffff;
}

.list_info .cate{
	width: 144px;
	font-size: 1.4rem;
	line-height: 1.6;
}
.list_info .date {
	width: 160px;
	font-size: 1.4rem;
	line-height: 1.8;
}

.list_info .title {
	flex: 1;
	font-size: 1.5rem;
	line-height: 1.6;
}

/* -- Selection button -- */
/* -- 01 -- */
a.btn-all-info{
display: inline-block;
min-width: 128px;
padding: 0.46em 0.64em;
text-decoration: none;
color:#ffffff !important;
font-weight: 500;
background: #14BAF3;
letter-spacing: 0.2em;
border-radius: 4px;
}
a.btn-all-info:hover{
color:#ffffff !important;
background: #0A9DCF;
}
/* -- 02 -- */
a.btn-user{
display: inline-block;
min-width: 128px;
margin:0 10px; /* -- center -- */
padding: 0.46em 0.64em;
text-decoration: none;
color:#ffffff !important;
font-weight: 500;
background: #D40468;
letter-spacing: 0.04em;
border-radius: 4px;
}
a.btn-user:hover{
color:#ffffff !important;
background: #AC0354;
}
/* -- 03 --*/
a.btn-owner{
display: inline-block;
min-width: 128px;
padding: 0.46em 0.64em;
text-decoration: none;
color:#ffffff !important;
font-weight: 500;
background: #f3a324;
letter-spacing: 0.04em;
border-radius: 4px;
}
a.btn-owner:hover{
color:#ffffff !important;
background: #CB800B;
}

/* -- Mark display -- */
/* -- 01 -- */
.all-user{
min-width: 108px;
color:#ffffff;
display: inline-block;
padding: 3px 10px;
text-decoration: none;
font-size:90%;
font-weight: 500;
background: #14BAF3;
letter-spacing: 0.04em;
border-radius: 5px;
text-align: center;
}
/* -- 02 --*/
.user{
min-width: 108px;
color:#ffffff;
display: inline-block;
padding: 3px 10px;
text-decoration: none;
font-size:90%;
font-weight: 500;
background: #D40468;
letter-spacing: 0.04em;
border-radius: 5px;
text-align: center;
}
/* -- 03 -- */
.owner{
min-width: 108px;
color:#ffffff;
display: inline-block;
padding: 3px 10px;
text-decoration: none;
font-size:90%;
font-weight: 500;
background: #f3a324;
letter-spacing: 0.04em;
border-radius: 5px;
text-align: center;
}

@media screen and (max-width: 1024px) {
.top-info {
max-width: 96%;
margin: 40px auto 2px;
padding:40px 5px 15px;
background-color: #CDEBEE;
border-radius: 24px;
}
.catego{
margin: -10px auto 4px;
text-align: center;
}
}
@media screen and (max-width: 767px) {
.catego{
max-width: 340px;
margin: -10px auto 4px;
text-align: center;
}
/* -- Selection button -- */
/* -- 01 -- */
a.btn-all-info{
display: inline-block;
min-width: 90px;
font-size: 90%;
padding: 0.35em 0.45em;
letter-spacing: 0.03em;
}
/* -- 02 -- */
a.btn-user{
display: inline-block;
min-width: 90px;
font-size: 90%;
margin:0 2px; /* -- center -- */
padding: 0.35em 0.45em;
letter-spacing: 0.03em;
}
/* -- 03 -- */
a.btn-owner{
display: inline-block;
min-width: 90px;
font-size: 90%;
padding: 0.35em 0.45em;
letter-spacing: 0.03em;
}


.top-info {
max-width: 96%;
margin: 40px auto 2px;
padding:15px 5px 15px;
background-color: #CDEBEE;
border-radius: 24px;
}
.list_info li {
display: flex;
flex-direction: column;
margin: 0 0 60px 0;
background: #ffffff;
padding:12px 10px 10px 10px;
}
.list_info .cate,
.list_info .date,
.list_info .title {
	display: block;
 width: 98%;
 padding: 3px;

}
	.list_info .cate{
	width: 130px;
	font-size: 1.3rem;
	line-height: 1.5;
}
.list_info .date {
	width: 140px;
	font-size: 1.3rem;
	line-height: 1.6;
}

.list_info .title {
	flex: 1;
	font-size: 1.4rem;
	line-height: 1.5;
}

}


/* TOP SCHEDULE
--------------------------------------------------------*/
.top-schedule {
width: 100%;
height: 100%;
margin:-160px auto 0;
z-index: 30;
text-align: center;

background-image:
url("../img/index/green-dot2.png"),
url("../img/index/yellow-dot.png"),
url("../img/index/green-dot1.png"),

url("../img/index/green-dot2.png"),
url("../img/index/yellow-dot.png"),
url("../img/index/green-dot1.png"),
url("../img/index/yellow-dot.png");
background-repeat:
no-repeat,
no-repeat,
no-repeat,
no-repeat,
no-repeat,
no-repeat,
no-repeat;
background-position:
top 140px left 20px,
top 300px left 30px,
top 480px left -70px,

top 140px right -80px,
top 380px right -10px,
top 500px right 10px,
top 600px right 10px;
background-size:
10%,
15%,
24%,

20%,
10%,
8%,
21%;
}

.top-schedule img {
width: 68%;
height: auto;
margin:-60px auto 10px;
z-index: 30;
}


/* ---　04  ---------*/
@media (min-width: 1500px) {
.top-schedule  {
margin:-150px auto 0;
}
.top-schedule img {
width: 75%;
height: auto;
margin:0 auto 10px;
z-index: 30;
}
}
/* ---　03  ---------*/
@media (max-width: 1300px) {
.top-schedule  {
margin:-145px auto 0;
}
}
@media (max-width: 1300px) {
.top-schedule img {
width: 70% !important;
height: auto;
margin:-60px auto 10px;
z-index: 30;
}
}

/* ---　01  ---------*/
@media screen and (max-width: 767px) {
.top-schedule .ban img{
width: 80%;
height: auto;
margin:-40px auto 0;
}
.top-schedule .cal img{
width: 70%;
height: auto;
margin:-20px auto 10px;
}
}


.start{
width: 64%;
font-size: 3.2rem;
font-size: 32px;
font-weight: 500;
margin: 0 auto 30px;
padding: 15px 20px;
color:#ffffff;
background:#e60020;
text-align: center;
}
/* ---　small  ---------*/
@media screen and (max-width: 767px) {
.start{
width: 90%;
font-size: 2.6rem;
font-size: 26px;
padding: 10px 20px;
}
}

.overview{
font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E,メイリオ,Meiryo,serif;
font-size: 3.0rem;
font-size: 30px;
font-weight: 600;
margin: 40px auto 30px;
text-align: center;
}
.overview2{
font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E,メイリオ,Meiryo,serif;
font-size: 3.0rem;
font-size: 30px;
font-weight: 600;
margin: -20px auto 30px;
text-align: center;
}
/*---- MOBILE ------*/
@media screen and (max-width: 767px) {
.overview{
font-size: 2.4rem;
font-size: 24px;
font-weight: 600;
margin: 40px auto 30px;
text-align: center;
}
.overview2{
font-size: 2.4rem;
font-size: 24px;
font-weight: 600;
margin: -20px auto 30px;
text-align: center;
}
}

.under-line{
background: #F9E363;
padding: 5px;
}


/* -- SCROLL_UP --*/
.scroll_up {
transition: 0.8s ease-in-out;
transform: translateY(30px);
opacity: 0;
}
.scroll_up.on {
transform: translateY(0);
opacity: 1.0;
}

/* -- TIME LAG --*/
.timing02 {
transition-delay: 0.2s;
}
.timing03 {
transition-delay: 0.6s;
}
.timing04 {
transition-delay: 1.0s;
}
.timing05 {
transition-delay: 1.4s;
}
.timing06 {
transition-delay: 1.4s;
}
.timing07 {
transition-delay: 1.6s;
}



/* TOP ROUTES
--------------------------------------------------------*/
/* ----　background round01----*/
.top-round {
position: relative;
background: #ffffff;
height: 20vh;
}
.top-round::after {
content: '';
border-top-left-radius: 50% 100%;
border-top-right-radius: 50% 100%;
position: absolute;
bottom: 0;
width: 100%;
background: #C40520;
height:80%;
}
/* ----　//background round01----*/
/* ---　small  ---------*/
@media (max-width: 767px) {
.top-round {
height: 16vh;
}
.top-round::after {
height:60%;
}
}

.top-routes{
position: relative;
padding: 30px 40px 88px;
margin-bottom: 40px !important;
/* ----　background round02----*/
background: #C40520;
height: auto;
border-bottom-left-radius: 60% 12%;
border-bottom-right-radius: 60% 12%;
}
/* ----　//background round02---*/
/* ---　small  ---------*/
@media (max-width: 767px) {
.top-routes{
padding: 30px 30px 100px;
border-bottom-left-radius: 90% 6%;
border-bottom-right-radius: 90% 6%;
height: auto;
}
}

.maru{
background:url("../img/index/maru.png");
background-repeat:no-repeat;
background-position:top center;
background-size:50%,
}

.bus-routes{
max-width: 980px;
margin: 0px auto 30px;
padding: 30px 50px 45px;
background:#ffffff;
text-align: left;
border-radius: 20px;
}
.bus-routes p{
font-size: 17px;
max-width: 100%;
font-weight: 600;
margin: 15px auto 0px;
padding: 0 12px;
line-height: 1.9;
letter-spacing: 0.05em;
text-align: left;
}

.bus-routes2{
max-width: 980px;
margin: 0px auto 30px;
padding: 30px 50px 45px;
background:#FBEAE9;
text-align: left;
border-radius: 20px;
}
.bus-routes2 p{
font-size: 17px;
max-width: 100%;
font-weight: 600;
margin: 15px auto 0px;
padding: 0 12px;
line-height: 1.8;
letter-spacing: 0.05em;
text-align: left;
}
.bus-routes a:link, .bus-routes2 a:link{
text-decoration: underline;
text-decoration-skip-ink: none;
text-decoration-thickness: 0.8px !important;
}
.bus-routes a:hover, .bus-routes2 a:hover {
text-decoration: underline;
color:#0091C5 !important;
}
.bus-routes a:visited, .bus-routes2 a:visited {
text-decoration: underline;
color:#222222;
}

/* ---　small  ---------*/
@media (max-width: 767px) {
.bus-routes{
padding: 15px 12px;
}
.bus-routes p{
font-size: 94%;
padding: 0 8px
}
}
@media (max-width: 767px) {
.bus-routes2{
padding: 15px 12px;
}
.bus-routes2 p{
font-size: 94%;
padding: 0 8px
}
}

/* HOW TO
--------------------------------------------------------*/
.howto{
max-width: 1100px;
margin:50px auto 40px;
padding:10px 10px;
}
.howto-illust{
display: flex;
justify-content: center;
align-items:flex-start;
}
.howto-illust img.redyaji{
margin: -30% auto 0;
}
.howto-illust p{
padding:0 0 0 2rem;
line-height: 1.2;
}
.ill1, .ill3{
padding-left:15px;
}
.ill2{
padding-right:15px;
}
/*---- MOBILE ------*/
@media screen and (max-width: 767px) {
.howto-illust p{
padding:0 0 0 0;
font-size: 94%;
letter-spacing: 0.04em;
}
.ill1, .ill3{
padding-left:5px;
}
.ill2{
padding-right:5px;
}
}

.attention{
max-width: 780px;
margin: 15px auto 0;
text-align: center;
}
.attention li{
list-style: none;
padding-left: 5%;
}
.atten-title{
font-weight: 400;
margin:10px 10px 10px;
font-size: 20px;
font-size: 2.0rem;
line-height: 1.0;
letter-spacing: 0.08em;
text-align:left;
}

/*---- MOBILE ------*/
@media screen and (max-width: 767px) {
.attention li{
list-style: none;
padding: 0 0 5px;
}
.atten-title{
font-weight: 400;
margin:10px 0 10px;
font-size: 19px;
font-size: 1.9rem;
}
}



/* CHECK THE BUS
--------------------------------------------------------*/
#check-bus{
position: relative;
width: 100%;

height: 600px;
margin:45px auto 0px;
padding:45px 20px 0 10px;
overflow: hidden;
background: url("../img/index/serching_bus_back.jpg");
background-position: top left;
background-repeat: no-repeat;
background-size: cover;
}
.check-bus-intoro{
margin:60px 10px 0 20px;
font-size: 18px;
font-size: 1.8rem;
font-weight: 600;
line-height: 1.6;
}

.serching-bus{
margin-top: -30px;
padding:0 15px;
}

.goog-norinav p{
padding:0px 30px 0 0;
font-size: 15px;
line-height: 1.4 !important;
}

.goog-norinav img{
margin:20px 0 0;
padding:50px 15px 0 0;
width: 80%;
vertical-align: middle;
}

/*---- MOBILE ------*/
@media screen and (max-width: 767px) {
#check-bus{
height: auto;
margin:-20px auto 20px !important;
padding:30px 0 0;
}

.check-bus-intoro{
margin:20px 5px 15px 10px;
font-size: 13px;
font-size: 1.3rem;
font-weight: 600;
line-height: 1.5;
}
.serching-bus{
padding:10px 5px 0 0;
}
.goog-norinav p{
padding:0;
margin-left:-10px;
font-size: 12px;
line-height: 1.4 !important;
}
.goog-norinav img{
margin:-55px 0 -5px -10px;
width: 80%;
}
.woman1 img{
padding:40px 0px 0 !important;
}
}


/* TOOL
--------------------------------------------------------*/
.tool{
max-width: 100%;
height: auto;
margin:10px auto 60px;
padding:45px 20px 40px 20px;
overflow: hidden;
background-image: url("../img/index/tool_back.jpg");
background-position: top center;
background-repeat: no-repeat;
background-size: cover;
text-align: center;
}
.tool-box{
max-width: 1260px;
padding:5px 10px;
text-align: center;
	}
.tool-item{
max-width: 100%;
margin:10px auto;
padding: 10px 20px;
text-align: center;
}
.tool-item img{
max-width: auto;
margin:0 auto;
text-align: center;
}

.tool-item p{
color: #ffffff;
max-width: 240px;
margin: 5px 0;
padding:0 3px 0 5px;
font-size: 14px;
line-height: 1.4 !important;
text-align: left;
}

/*---- MOBILE ------*/
@media screen and (max-width: 767px) {
.tool-item p{
max-width: 100%;
margin: 5px 0;
padding:0 4px;
font-size: 14px;
line-height: 1.4 !important;
text-align: left;
}
}


/* FAMIWARI
--------------------------------------------------------*/
.famiwari{
margin:0 auto ;
text-align: center;
}
.famiwari img{
width: 54%;
margin:0 auto 26px;
padding:9px;
border :#cf2c2f 2px solid;
}
@media screen and (max-width: 767px) {
.famiwari img{
width: 80% !important;
margin:0 auto 26px;
}
}


/* VIDEO
--------------------------------------------------------*/
.video{
width: 100%;
margin:0 auto;
}

.video-box{
max-width: 1300px;
min-height: 400px;
margin:35px auto 50px;
padding:30px 35px 20px;
border :#00A0C0 3px solid;
border-radius: 15px;
text-align: center;

background-image:
url("../img/index/yellow-dot.png"),
url("../img/index/green-dot2.png"),
url("../img/index/yellow-dot.png"),
url("../img/index/green-dot1.png"),
url("../img/index/green-dot1.png"),

url("../img/index/yellow-dot.png"),
url("../img/index/green-dot2.png"),
url("../img/index/green-dot2.png"),
url("../img/index/yellow-dot.png"),
url("../img/index/green-dot2.png"),
url("../img/index/yellow-dot.png");

background-repeat:
no-repeat,
no-repeat,
no-repeat,
no-repeat,
no-repeat,
no-repeat,
no-repeat,
no-repeat,
no-repeat,
no-repeat,
no-repeat;
background-position:
top -14px left 260px,
top 10px left 10px,
top 50px left 70px,
top 250px left -40px,
top 380px left 180px,

top -50px right 260px,
top 0px right 170px,
top -95px right -120px,
top 110px right -10px,
top 290px right -10px,
top 380px right 110px;
background-size:
8%,
10%,
15%,
19%,
11%,

7%,
9%,
20%,
17%,
10%,
18%;
}

.video-wrap{
max-width: 100%;
width: 98%;
margin:0 auto;
padding:10px 15px 30px;
text-align: center;
}
.video-wrap p{
margin:5px auto 15px;
font-size: 90%;
letter-spacing: 0.04em;
line-height: 1.3;
text-align: left;
}

.video-wrap img{
margin:0 auto;
padding:0 10px;
}

/*---- MOBILE ------*/
@media screen and (max-width: 1300px) {
.video{
width: 97%;
margin:0 auto;
}
}
@media screen and (max-width: 767px) {
.video-box{
max-width: 1300px;
min-height: auto;
margin:45px auto 40px;
padding:25px 15px 15px;
background-size:
18%,
20%,
15%,
29%,
11%,

27%,
19%,
30%,
37%,
20%,
28%;
}
.video-wrap{
max-width: 100%;
width: 100%;
margin:0 auto;
padding:0 5px 30px;
text-align: center;
}
}


/* TOP TRAVEL-PLAN
--------------------------------------------------------*/
#travel-plan{
width: 100%;
margin: 40px auto 0px;
text-align: center;
overflow: hidden;
}
.travel-plan{
width: 100%;
height: auto;
margin: 0 auto;
padding:50px 40px 44px;
background-color: #0bb2bf;
background-image:
	url("../img/index/plan_hat.png"),
	url("../img/index/plan_camera.png");
background-repeat:no-repeat, no-repeat;
background-size: 10%, 11%;
background-position:
	bottom 280px left -10px,
	bottom 280px right -5px;
}
/*---- TAB ------*/
@media screen and (max-width: 1080px) {
.travel-plan{
padding:50px 0 44px;
background-image:
	url("../img/index/plan_hat.png"),
	url("../img/index/plan_camera.png");
background-repeat:no-repeat, no-repeat;
background-size: 10%, 11%;
background-position:
	top 480px left 0px,
	top 490px right -2px;
}
}
/*---- MOBILE ------*/
@media screen and (max-width: 767px) {
.travel-plan{
padding:50px 0 24px;
background-image:
	url("../img/index/plan_hat.png"),
	url("../img/index/plan_camera.png");
background-repeat:no-repeat, no-repeat;
background-size: 11%, 12%;
background-position:
	top 300px left -2px,
	top 320px right -4px;
}
}


.each-plan{
padding: 15px;
}
.each-plan img{
border-radius: 20px 20px 20px 20px;
}
.tra-plan{
width: 64%;
margin: 10px auto 24px;
color: #ffffff;
text-align: left;
}

.each-plan p{
margin: 10px auto 24px;
padding:0 10px;
font-size: 94%;
color: #ffffff;
line-height: 1.4;
text-align: left;
}

/*---- MOBILE ------*/
@media screen and (max-width: 767px) {
.tra-plan{
width: 78%;
font-size: 96%;
}
}

/* NORIHODAY-WARI
--------------------------------------------------------*/
#noriho-wari{
width: 100%;
margin: 4px auto 0px;
padding:40px 15px 15px;
background-color: #AFDFE4;
background-image:
url("../img/index/white-dot3.png"),
url("../img/index/white-dot2.png"),
url("../img/index/green-dot1.png"),
url("../img/index/white-dot1.png"),
url("../img/index/green-dot2.png"),
url("../img/index/white-dot1.png"),
url("../img/index/green-dot1.png"),

url("../img/index/white-dot3.png"),
url("../img/index/green-dot2.png"),
url("../img/index/green-dot1.png"),
url("../img/index/white-dot1.png"),
url("../img/index/white-dot1.png"),
url("../img/index/green-dot1.png"),
url("../img/index/white-dot1.png"),
url("../img/index/white-dot3.png");
background-repeat:
no-repeat,
no-repeat,
no-repeat,
no-repeat,
no-repeat,
no-repeat,
no-repeat,

no-repeat,
no-repeat,
no-repeat,
no-repeat,
no-repeat,
no-repeat,
no-repeat;
background-position:
top 25px left 140px,
top 140px left -80px,
top 490px left -30px,
top 680px left -10px,
top 1100px left 40px,
top 1500px left 5px,
top 1800px left -30px,

top 15px right 10px,
top 104px right 80px,
top 280px right -70px,
top 580px right 5px,
top 890px right -60px,
top 1300px right 10px,
top 1580px right -200px,
top 1900px right 50px;
background-size:
13%,
24%,
13%,
27%,
31%,
13%,
19%,

10%,
10%,
21%,
28%,
16%,
19%,
28%,
13%;
}


/*---- MOBILE ------*/
@media screen and (max-width: 767px) {
#noriho-wari{
margin: 4px auto 0px;
padding:25px 14px 10px;
}
}

.daywari{
max-width: 1000px;
margin:0px auto 0px;
padding:10px 25px;
text-align: center;
}
.daywari img{
width: 90%;
}
/*---- MOBILE ------*/
@media screen and (max-width: 767px) {
.daywari{
padding:10px 0;
}
.daywari img{
width: 100%;
}
}

.facility{
max-width: 980px;
margin:-10px auto 20px;
padding:35px 20px 20px;
text-align: left;
background: #ffffff;
border-radius: 20px;
}
.recruiting{
font-size: 120%;
font-weight: 500;
}
.sma-br{
display: none;
}

/*---- MOBILE ------*/
@media screen and (max-width: 767px) {
.facility{
padding:25px 10px 15px;
}
.recruiting{
font-size: 106%;
padding:5px 0 0px;
text-align: left !important;
}
.sma-br{
display: block;
}
}

.bus-faci{
width: 90%;
margin:-20px auto 40px;
}

.text90p{
width: 90%;
margin:0 auto 20px;
padding-left: 20px;
text-align: left;
}
.text80p{
width: 88%;
margin:0 auto 15px;
padding-left: 20px;
line-height: 1.5;
text-align: left;
}
.text70p{
max-width: 70%;
margin:20px auto 40px;
padding-left: 20px;
text-align:center;
}
/*---- MOBILE ------*/
@media screen and (max-width: 767px) {
.text90p{
width: 98%;
}
.text80p{
font-size: 98%;
width: 98%;
padding-left: 0;
text-align: left;
line-height: 1.3;
}
.text70p{
max-width: 90%;
padding-left: 0;
}
}
.dotted-line{
border-bottom: 1px solid #009DA5;
padding-bottom:10px;
margin-bottom:35px;
}

.process{
max-width: 780px;
margin: 25px auto 20px;
padding-left: 0;
text-align: center;
}
.process li{
list-style: decimal;
padding-bottom: 15px;
}

/*---- MOBILE ------*/
@media screen and (max-width: 767px) {
.process{
margin: 30px auto 20px;
padding-left: 0;
text-align: center;
}
.process li{
list-style: decimal;
margin-left: 30px;
padding-left: 0;
}
}

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

/* MONITOR
-------------------------------------------------------*/
.monitor{
width: 100%;
margin: 0 auto;
padding:10px 20px 0;
background-color: #AFDFE4;
text-align: center;
}
.monitor img{
max-width: 500px;
margin: 10px auto 40px;
}
/*---- MOBILE ------*/
@media screen and (max-width: 767px) {
.monitor img{
max-width: 96%;
margin: -10px auto 20px;
}
}

/* QUESTIONNAIRE
-------------------------------------------------------*/
.questionnaire{
width: 100%;
margin: 0 auto;
padding:10px 40px 20px;
background-color: #AFDFE4;
text-align: center;
}
.questionnaire img{
max-width: 500px;
margin: 10px auto 0;
}
/*---- MOBILE ------*/
@media screen and (max-width: 767px) {
.questionnaire img{
max-width: 96%;
margin: -10px auto 0px;
text-align: center;
}
}

/* QUESTANT
-------------------------------------------------------*/
.questant{
width: 100%;
margin: 0 auto;
padding:10px 20px 20px;
background-color: #AFDFE4;
text-align: center;
}
.questant img{
margin: 10px auto 0;
}
/*---- MOBILE ------*/
@media screen and (max-width: 767px) {
.questant{
padding:10px 14px 20px;
}
.questant img{
max-width: 100%;
margin: -10px auto 0px;
text-align: center;
}
}

/* COOPERATION
-------------------------------------------------------*/
.cooperation{
width: 100%;
margin: 0 auto;
padding:20px 15px 15px;
background-color: #AFDFE4;
}

.cooper-box{
max-width: 980px;
margin:-10px auto 40px;
padding:30px 45px 35px;
text-align: left;
background: #ffffff;
border-radius: 20px;
}
.cooper-box p{
margin-top: -10px;
font-size: 16px;
font-size: 1.6rem;
font-weight: 400;
line-height: 1.8;
letter-spacing: 0.06em;
}
.cooper-box p a:link{
color:#222222;
}
.cooper-box p a:visited{
color:#222222;
}
.cooper-box p a:hover {
color:#0091C5;
}
/*---- MOBILE ------*/
@media screen and (max-width: 767px) {
.cooper-box{
margin:-15px auto 40px;
padding:30px 20px 30px;
}
}

/* FOOTER
------------------------------------------------------*/
/*top-footer*/
footer{
margin-bottom: 0;
width:100%;
height:auto;
color:#fff;
padding:12px 0 0px 0px;
background-color:#01B9CE;
vertical-align: bottom;
z-index: 200;
text-align:center;
}

footer .pri_cont a{
color: #ffffff;
font-size:1.6rem;
margin:0px auto 0;
letter-spacing: 0.08em;
text-align:center;
}
footer .pri_cont a:visited{
color: #ffffff;
}
footer .pri_cont a:hover  {
color: #e60020;
}

footer .copyright{
color: #ffffff;
font-size:1.1rem;
margin:20px auto 20px;
letter-spacing: 0.08em;
text-align:center;
}

/*---- MOBILE ------*/
@media screen and (max-width: 767px) {
footer{
height:auto;
padding:10px 0 65px !important;
text-align:center;
}
footer .pri_cont a{
font-size:1.4rem;
}
}

/*---Google ICONS---*/
.material-icons {
font-family: 'Material Icons';
font-weight: normal;
font-style: normal;
font-size: 37px;
line-height: 1;
letter-spacing: normal;
text-transform: none;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
-moz-font-feature-settings: 'liga';
-moz-osx-font-smoothing: grayscale;

display: inline-flex;
vertical-align: middle;
}

/* -------　LOWER LOGO -------*/
.lower-logo{
margin-top: -10px;
display: flex;
justify-content: center;
}

/* -- okinawa prf --*/
.logo-bottom1{
width:  160px;
}
/* -- watter bus --*/
.logo-bottom2{
width:  140px;
}
/* -- watter bus --*/
.logo-bottom3{
width:  124px;
}

.logo-bottom1 img, .logo-bottom2 img, .logo-bottom3 img {
padding-right: 35px;
}

/*---- MOBILE ------*/
@media screen and (max-width: 767px) {
/* -- okinawa prf --*/
.logo-bottom1{
width:  150px;
}
/* -- watter bus --*/
.logo-bottom2{
width:  130px;
}
/* -- watter bus --*/
.logo-bottom3{
width:  114px;
}
.logo-bottom1 img, .logo-bottom2 img, .logo-bottom3 img {
padding-left: 12px;
padding-right: 12px;
}
}


/* BOTTOM NAVI
----------------------------------------------------*/
#bottom-fixed-nav{
position: fixed;
width: 100%;
bottom: 0px;
font-size: 0;
opacity: 0.9;
z-index: 400;
}

#bottom-fixed-nav ul{
display: flex;
list-style: none;
padding:0;
margin:0;
width:100%;
}

#bottom-fixed-nav li{
justify-content: center;
align-items: center;
width: 50%;
padding:0;
margin:0;
font-size: 15px;
font-weight: 500;
line-height: 1.4;
border-right: 1px solid #fff;
}


/*left*/
#bottom-fixed-nav li:first-child{
background: #C40520;
}

/*right*/
#bottom-fixed-nav li:last-child{
background: #f3a324;
}

/*ボタンを調整*/
#bottom-fixed-nav li a{
color: #fff;
text-align: center;
display:block;
width: 100%;
padding:16px;
}

/*PCでは非表示*/
@media (min-width: 768px) {
.bott-nav{
display:none;
}
}

/* MOVING BUS
----------------------------------------------------*/
.moving-bus{
width: 200px;
height: 120px;
border-radius: 10px;
background-image: url("../img/index/movingbus.png");
background-size: 50% 50%;
background-position: 0 0;
background-repeat: no-repeat;
display: block;
position: relative;
}

/*---- MOBILE ------*/
@media screen and (max-width: 767px) {
.moving-bus{
width: 160px;
height: 96px;
}
}

.moving-bus.anime{
animation-name: upDown;
animation-iteration-count: infinite;
animation-duration: 0.1s;
animation-direction: alternate;
animation-timing-function: steps(6);
transition-duration: .3s;
transition-property: transform;
}

.moving-bus-stage{
position: relative;
width: 100%;
height: 80px;
top: 0px;
display: block;
background-color: #AFDFE4;
border-bottom: solid #777 1px;
}
/*---- MOBILE ------*/
@media screen and (max-width: 767px) {
.moving-bus-stage{
height: 66px;
}
}

.moving-bus-wrap{
display: block;
position: absolute;
top: 20px;
animation-fill-mode: forwards;
animation-timing-function: linear;
animation-duration: 15s;
animation-iteration-count: 1;
margin-right: -70px;
}

.moving-bus-wrap[data-order="left"] {
animation-name: GoLeft;
}
.moving-bus-wrap[data-order="right"] {
animation-name: GoRight;
}
[data-order="right"] > .moving-bus {
transform: rotateY(180deg);
}

@keyframes GoLeft {
0% { right: 5%; }
100% { right: 95%; }
}
@keyframes GoRight {
0% { right: 95%; }
100% { right: 5%; }
}

@keyframes upDown {
0% { top: 0; }
100% { top: 1px; }
}

/* top banner */
.box_top_banner {
    margin-top: 80px;
}
.box_top_banner img {
    width: 64%!important;
}
@media screen and (max-width: 767px) {
    .box_top_banner img {
        width: 90%!important;
    }
}