@charset "utf-8";
@import url("style_mobile.css");
/* CSS Document */

@font-face {
  font-family: 'MyWebFont';
  src: url('webfont.eot'); /* IE9 Compat Modes */
  src: url('webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('webfont.woff') format('woff'), /* Modern Browsers */
       url('webfont.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('webfont.svg#svgFontName') format('svg'); /* Legacy iOS */
}

body {
	font-weight: 400;
	font-family: "Noto Sans Japanese";
	height: auto;
	margin: 0;
	overflow-x: hidden;
	position: relative;
}

@keyframes fadein {
	0% { opacity: 0; }
	100% { opacity: 1; }
}

dl,dt,dd { margin: 0; }

#warpper {
	margin: auto;
	padding: 0 auto;
}


/* header */
header {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 20px 0;
	z-index: 10;
}

header .logo { margin: 0 0 0 60px; }
header .logo span { display: block; font-size: .8rem; font-weight: normal; color: #fff; }
header .logo a {
	font-size: .8em;
    color: #fff;
    text-decoration: none;
    letter-spacing: .1em;
}
header .logo a span {
	display: block;
	font-size: .9rem;
	letter-spacing: .1em;
}

header #pc_nav { display: block; width: 620px; margin-right: 60px; }
header #pc_nav .menu {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
header #pc_nav .menu ul {
	width: 100%;
	list-style: none;
	padding: 0;
	display: flex;
	justify-content: space-between;
	font-style: normal;
	font-weight: 500;
}
header #pc_nav .menu ul li a { position: relative; font-size: 1.1rem; color: #fff; text-decoration: none; }
header #pc_nav .menu ul li a::after {
	position: absolute;
	bottom: -10px;
	left: 0;
	content: '';
	width: 100%;
	height: 3px;
	background: #fff;
	transform: scale(0,1);
	transform-origin: left top;
	transition: transform .3s;
}
header #pc_nav .menu ul li a:hover::after {
	transform: scale(1,1);
}

header #pc_nav .menu ul li:not(:last-of-type){ padding-right: 2em; border-right: 1px #fff solid; }
header #pc_nav .menu ul li .contact_menu_list {
    position: relative;
    padding: 0.7rem 2rem;
	font-weight: bold;
	color: #00af85;
	background-color: #fff;
	border-radius: 100px;
    transition: .5s;
}
header #pc_nav .menu ul li .contact_menu_list:hover {
	color: #fff;
    background-color: #00af85;
}


/* space */
.space01 { width: 100%; height: 10px; }
.short_space { width: 100%; height: 40px; }


/* ※SMARTPHONE MENU */
.button_container { display: none; }
.overlay { display: none; }


/* common */
#content { width: 90%; width: 1200px; margin: 0 auto; padding: 100px 0; }
#content p { font-weight: 500; color: #2f3739; letter-spacing: 0.05rem; line-height: 1.8rem; }

h2.ttl {
	position: relative;
	margin: 0;
	padding: 0 0 10px;
	font-size: 2.5rem;
	font-weight: 800;
	color: #00af85;
	letter-spacing: 0.05rem;
}

h2.sub-ttl {
	position: relative;
	padding: 0 0 10px;
	font-size: 1.8rem;
	font-weight: 800;
	color: #00af85;
	letter-spacing: 0.05rem;
	border-bottom: solid 3px #ddd;
}
h2.sub-ttl::after {
	content: " ";
	position: absolute;
	display: block;
	border-bottom: solid 3px #00af85;
	bottom: -3px;
	width: 10%;
}

h3.sub-ttl {
	position: relative;
	padding: 0 0 10px;
	font-size: 1.8rem;
	font-weight: 800;
	color: #00af85;
	letter-spacing: 0.05rem;
	border-bottom: solid 3px #ddd;
}
h3.sub-ttl::after {
	content: " ";
	position: absolute;
	display: block;
	border-bottom: solid 3px #00af85;
	bottom: -3px;
	width: 10%;
}


/* slide */
#vegas {
    width: 100%;
    height: 100vh;
	margin: auto;
	margin-bottom: 100px;
	position: relative;
}
#vegas .bg { background-color: rgba(0,0,0,0.2); width: 100%; height: 100%; }
#vegas .caption {
	position: absolute;
  	top: 60%;
  	left: 10%;
  	transform: translateY(-60%);
  	-webkit- transform: translateY(-60%);
  	margin: auto;
	color: #fff;
}
#vegas .caption h2 { margin: 0; font-size: calc(48 / 1200 * 100vw); font-weight: 600; line-height: 1.3; }
#vegas .caption span {
	display: block;
	font-size: 1.2rem;
	font-weight: 500;
	line-height: 1.8em;
	letter-spacing: .05em;
	margin-top: 50px;
	margin-bottom: -5px;
}
#vegas .caption .sp-br { display: none; }


/* scroll */
.scroll-Block { position: absolute; bottom: 3rem; right: 0px; z-index: 5; }
.scroll-Block .Txt {
    display: block;
	position: relative;
	bottom: 1.7rem;
	right: 0;
	font-size: .8em;
	font-weight: bold;
    line-height: 1;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}
.scroll-Block .Txt a { color: #fff; text-decoration: none; letter-spacing: .1em; }
.scroll-Block .Line {
    position: relative;
    margin: 50px 0 0 55px;
    width: 2px;
    height: 60px;
    overflow: hidden;
    z-index: 10;
}
.scroll-Block .Line:after, .scroll-Block .Line:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 2px;
    height: 100%;
}
.scroll-Block .Line:before {
    background: #FFF;
    z-index: 10;
    -webkit-animation: scroll 2s infinite normal;
    animation: scroll 2s infinite normal;
}
.scroll-Block .Line:after {
    background: transparent;
}

@-webkit-keyframes scroll {
	0% {
		-webkit-transform: translate3d(0,-100%,0);
	}
	15% {
		-webkit-transform: translate3d(0,-98%,0);
	}
	85% {
		-webkit-transform: translate3d(0,98%,0);
	}
	100% {
		-webkit-transform: translate3d(0,100%,0);
	}
}


/* トップページ 会社案内 */
.company_bg { position: relative; }
.company_bg::before {
    content: "";
    top: -6%;
    left: 0;
    position: absolute;
    width: 460px;
    height: 650px;
    background-color: #00af85;
    z-index: -10;
}

.top_company_content {
	max-width: 1400px;
    width: 90%;
    margin: 150px auto 100px auto;
}
.top_company_content .inner {
    display: flex;
    justify-content: space-between;
}

.top_company_content .inner .img_box { width: 40%; }
.top_company_content .inner .img_box img { width: 100%; height: 670px; object-fit: cover; vertical-align: top; }

.top_company_content .inner .txt_box { width: 53%; }
.top_company_content .inner .txt_box .top_main_ttl { margin-bottom: 50px; }
.top_company_content .inner .txt_box .top_main_ttl .ttl_ja::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100px;
    height: 1px;
    background-color: #111;
}
.top_company_content .inner .txt_box .top_main_ttl .ttl_en {
	margin: 0 0 20px 0;
    font-size: 1.6em;
	font-weight: 600;
    color: #a5cec3;
}
.top_company_content .inner .txt_box .top_main_ttl .ttl_ja {
    position: relative;
	font-size: calc(25 / 1200 * 100vw);
	font-weight: 800;
	color: #00af85;
    line-height: 1.5em;
    letter-spacing: 0.03em;
    margin: 0;
    padding: 0 0 55px 0;
}

.top_company_content .inner .txt_box .txt { margin-bottom: 60px; }
.top_company_content .inner .txt_box .txt p { margin: 0 0 1.5em 0; font-size: 1.1rem; font-weight: 500; color: #2f3739; line-height: 2rem; }

.btn {
	display: inline-block;
	position: relative;
	padding: 1rem 2rem;
	overflow: hidden;
	text-decoration: none;
	border: 1px solid #222;
	text-align: center;
	outline: none;
	transition: ease .2s;
}
.btn span {
	position: relative;
	z-index: 3;
	font-weight: 600;
	color: #111;
}
.btn:hover span {
	color: #fff;
}

/*== 背景が流れる（斜め） */
.bgskew::before {
	content: '';
	position: absolute;
	top: 0;
	left: -130%;
	width: 120%;
	height: 100%;
	background: #111;
	transform: skewX(-25deg);
}
.bgskew:hover::before {
	animation: skewanime .5s forwards;
}

@keyframes skewanime {
	100% {
		left: -10%;
	}
}

.common_btn {
	display: flex;
	align-items: center;
	width: 250px;
	height: 65px;
	text-decoration: none;
	border-radius: 60px;
	border: 1px solid #00af85;
	background-color: #00af85;
	position: relative;
	transition: 0.3s;
}
.common_btn::after {
	position: absolute;
	content: "";
	background: url("../images/common/common-ar-on.svg") no-repeat center;
	background-size: cover;
	width: 26px;
	height: 10px;
	top: 50%;
	transform: translate(-50%, -50%);
	right: 12px;
	transition: 0.3s;
}
.common_btn span {
    font-size: 1rem;
	font-weight: 600;
    letter-spacing: 0.05em;
    color: #fff;
    padding-left: 30px;
    transition: 0.3s;
}
.common_btn:hover { background: #fff;}
.common_btn:hover span { color: #00af85; }
.common_btn:hover::after {
	background: url("../images/common/common-ar.svg") no-repeat center;
	background-size: cover;
}

/* 事業案内 */
.top_tire { padding: 0 0 100px; }
.top_tire .inner { display: flex; flex-wrap: wrap; align-items: center; }
.top_tire .inner .flex_item01 { width: 50%; padding: 0 5% 0 10%; box-sizing: border-box; }
.top_tire .inner .flex_item01 h2 { margin-top: 0; font-size: calc(25 / 1200 * 100vw); color: #00af85; }
.top_tire .inner .flex_item01 h3 { font-size: calc(20 / 1200 * 100vw); color: #222; }
.top_tire .inner .flex_item01 p { margin-bottom: 30px; text-align: justify; line-height: 1.8; }

.top_tire .inner .flex_item02 { position: relative; width: 50%; }
.top_tire .inner .flex_item02 img { width: 100%; max-width: 100%; height: 450px; object-fit: cover; vertical-align: bottom; }
.top_tire .inner .flex_item02 .flex_imgBox { display: flex; justify-content: center; margin: 0 auto; margin-top: -50px; }
.top_tire .inner .flex_item02 .flex_imgBox .item { width: 30%; margin: 0 10px; }
.top_tire .inner .flex_item02 .flex_imgBox .item img { height: auto; }

/* お知らせ */
#top_content { width: 100%; }

#top_news { padding: 100px 0; background: #00af85; }
#top_news .inner { display: flex; flex-wrap: wrap; justify-content: space-between; position: relative; width: 90%; max-width: 1400px; margin: 0 auto; }
#top_news .inner .top_main_ttl { width: 20%; }
#top_news .inner .top_main_ttl .ttl_en { margin: 0; font-size: 1.6em; font-weight: 600; color: #fff; }
#top_news .inner .top_main_ttl .ttl_ja { display: block; margin: 0.5vw 0 0; font-size: 2rem; font-weight: 600; color: #fff; }

#top_news .inner .top_news__list { width: 75%; }
#top_news .inner .top_news__list dl {
	display: flex;
	flex-wrap: wrap;
	padding-bottom: 1.5em;
	margin-bottom: 1.5em;
	border-bottom: 1px rgba(255,255,255,0.3) solid;
}
#top_news .inner .top_news__list dl:last-of-type { margin-bottom: 0; }
#top_news .inner .top_news__list dt { margin-right: 30px; color: #fff; letter-spacing: 0.05em; }
#top_news .inner .top_news__list dd a { color: #fff; text-decoration: none; transition: 0.3s; }
#top_news .inner .top_news__list dd a:hover { color: #fff; text-decoration: underline; }

#top_news .inner .common_btn { position: absolute; bottom: 0; left: 0; border: 1px solid #fff; background-color: #fff; }
#top_news .inner .common_btn:hover { background: #00af85;}
#top_news .inner .common_btn span { color: #00af85; }
#top_news .inner .common_btn:hover span { color: #fff; }
#top_news .inner .common_btn::after { background: url("../images/common/common-ar.svg") no-repeat center; }
#top_news .inner .common_btn:hover::after { background: url("../images/common/common-ar-on.svg") no-repeat center; }


/* index_content */
.content_flex_box { width: 100%; height: auto; margin: 0 auto; display: flex; justify-content: space-between; }

.content_item_box { width: 33.333333%; height: auto; text-align: center; position: relative; }
.content_item_box a { display: block; color: #111; text-decoration: none; }
.content_item_box a figure { width: 100%; margin: 0 auto; position: relative; line-height: 0; overflow: hidden; }
.content_item_box a figure img { transition: transform 0.4s ease; }
.content_item_box a:hover figure img { transform: scale(1.1); }

.content_item_box .text_box {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 2rem 3rem;
	box-sizing: border-box;
	border-bottom: 5px solid #00af85;
}
.content_item_box .text_box .text_area { width: 65%; text-align: left; }
.content_item_box .text_box .text_area span { display: block; font-size: 1.2rem; font-weight: bold; color: #a5cec3; }
.content_item_box .text_box .text_area p { display: block; margin: 0.5vw 0 0; font-size: 2rem; font-weight: 600; color: #00af85; }

.content_item_box .button { width: 70%; margin: 30px auto 0 auto; }
.content_item_box .button a {
	display: block;
	padding: 1em;
	font-size: .9em;
	font-weight: normal;
	color: #0f214e;
	border: 1px #0f214e solid;
	box-sizing: border-box;
	transition: .3s;
}
.content_item_box .button a:hover { color: #fff; background: #0f214e; }

.content_item_box .circle_arrow {
	display: block;
	width: 55px;
	height: 55px;
	border-radius: 50%;
	border: 1px solid #00af85;
	position: relative;
	transition: background-color 0.2s ease;
}
.content_item_box .circle_arrow::after {
	position: absolute;
	transition: filter 0.2s ease;
	content: "";
	background: url("../images/common/common-ar.svg") no-repeat center;
	background-size: cover;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 20px;
	height: 7px;
}
.content_item_box a:hover .circle_arrow { background-color: #00af85; }
.content_item_box a:hover .circle_arrow::after {
	background: url("../images/common/common-ar-on.svg") no-repeat center;
}


/* common */
.page-head {
    overflow: hidden;
    padding: 200px 0 130px;
	background: url("../images/company/page_head_back01.png") no-repeat;
	background-position: right;
	background-size: cover;
}
.page-head-ttl {
	width: 90%;
	max-width: 1200px;
	margin: 0 auto;
    position: relative;
}
.page-head-ttl__main {
	position: relative;
    display: block;
    margin: 0 0 10px;
    font-size: 3em;
    font-weight: 800;
    font-style: normal;
	color: #fff;
    z-index: 1;
}
.page-head-ttl__sub {
	position: relative;
    display: block;
    font-size: .9em;
    color: #fff;
    letter-spacing: .1em;
    z-index: 1;
}


h2.anchor {
	display: block;
    padding-top: 70px;
    margin-top: -70px;
}


/* フッターコンタクト */
.top_contact_content {
    position: relative;
	padding: 100px 0;
}
.top_contact_content .inner {
    max-width: 1400px;
    width: 90%;
    margin: 0 auto;
}
.top_contact_content .inner .contact_ttl { text-align: center; }
.top_contact_content .inner .contact_ttl .ttl_en {
	margin: 0 0 20px 0;
    font-size: 1.6em;
    font-weight: 600;
    color: #a5cec3;
}
.top_contact_content .inner .contact_ttl .ttl_ja {
	position: relative;
    font-size: 2.7em;
    font-weight: 800;
	color: #00af85;
    line-height: 1.5em;
    letter-spacing: 0.03em;
    margin: 0;
}
.top_contact_content .inner .contact_lead {
    font-size: 1.1rem;
	font-weight: 600;
	color: #2f3739;
	text-align: center;
	line-height: 2rem;
    margin-top: 30px;
}
.top_contact_content .inner .contact_tel {
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 30px 0 0;
	font-size: 1.1rem;
	font-weight: 500;
	color: #2f3739;
	line-height: 1rem;
}
.top_contact_content .inner .contact_tel span:nth-child(2) {
	font-size: 2rem;
	font-weight: 600;
	color: #00af85;
	margin: 0 0 0 10px;
}

.top_contact_content .common_btn {
	display: flex;
	align-items: center;
	width: 280px;
	height: 65px;
	margin: 40px auto;
	text-decoration: none;
	border-radius: 60px;
	border: 1px solid #00af85;
	background-color: #00af85;
	position: relative;
	transition: 0.3s;
}
.top_contact_content .common_btn::after {
	position: absolute;
	content: "";
	background: url("../images/common/common-ar-on.svg") no-repeat center;
	background-size: cover;
	width: 26px;
	height: 10px;
	top: 50%;
	transform: translate(-50%, -50%);
	right: 12px;
	transition: 0.3s;
}
.top_contact_content .common_btn span {
    font-size: 1rem;
	font-weight: 600;
    letter-spacing: 0.05em;
    color: #fff;
    padding-left: 30px;
    transition: 0.3s;
}
.top_contact_content .common_btn:hover { background: #fff;}
.top_contact_content .common_btn:hover span { color: #00af85; }
.top_contact_content .common_btn:hover::after {
	background: url("../images/common/common-ar.svg") no-repeat center;
	background-size: cover;
}


/* フッター */
#footer {
	background: #00af85;
	width: 100%;
	height: auto;
	overflow: hidden;
	margin: auto;
	padding: 50px 0;
	text-align: center;
	color: #FFF;
}

#footer p { box-sizing: border-box; font-size: 100%; font-weight: 400; margin: 0px; }
#footer .company-name {
	margin-bottom: 30px;
}
#footer .company-name a {
	font-size: 1.5rem;
	font-weight: 600;
	color: #fff;
	text-decoration: none;
	letter-spacing: .1em;
}
#footer .company-name a span {
	display: block;
	font-size: .55em;
	letter-spacing: .1em;
}

#footer .add { margin-bottom: 10px; }
#footer .add span { margin-right: 20px; font-weight: 500; letter-spacing: .05em; }
#footer .add span:last-child { margin: 0; }

#footer .copy { font-weight: 200; font-size: .8em; padding: 10px; margin-top: 40px; letter-spacing: .05em; }

.footer_nav ul {
	width: 100%;
	margin: 0;
	margin-bottom: 30px;
	padding: 0;
	text-align: center;
	float: left;
	box-sizing: border-box;
}

.footer_nav li {
	padding: 10px;
	margin: 0 5px;
	display: inline-block;
	font-size: 1em;
    font-style: normal;
    font-weight: 500;
	letter-spacing: .05em;
}

.footer_nav li a {
	text-decoration: none;
	padding-bottom: 3px;
	display: block;
	position: relative;
	font-weight: 500;
	color: #fff;
	transition: .3s;
}

.footer_nav li a:hover {
	color: #B5B5B5;
}


/* 事業案内・製品案内 */
.business {}
.business .flex-box { display: flex; align-items: center; }
.business .flex-box .text-area { width: 50%; padding: 0 5% 0 10%; box-sizing: border-box; }
.business .flex-box .text-area .ttl { font-size: calc(38 / 1200 * 100vw); }
.business .flex-box .text-area .ttl.small { font-size: calc(27 / 1200 * 100vw); text-align: justify; }
.business .flex-box .text-area .text { width: 90%; font-size: 1rem; font-weight: 500; line-height: 2rem; text-align: justify; }

.business__area01 { width: 90%; max-width: 1200px; margin: 0 auto; padding: 100px 0; }
.business__area01 .text-box { margin-top: 60px; }
.business__area01 .text-box:first-child { margin-top: 0; }
.business__area01 .text-box .ttl { font-size: calc(35 / 1200 * 100vw); }
.business__area01 .text-box p { font-size: 1rem; font-weight: 500; line-height: 2rem; }

.business__area02 { position: relative; padding: 8vw 0 8vw; }

.business__area03 { position: relative; padding: 8vw 0 8vw; background: #00af85; }
.business__area03 .flex-box .text-area { width: 50%; padding: 0 5%; box-sizing: border-box; }
.business__area03 .flex-box .text-area .ttl { font-size: calc(27 / 1200 * 100vw); color: #fff; }
.business__area03 .flex-box .text-area .text { width: 80%; font-size: 1rem; font-weight: 500; color: #fff; line-height: 2rem; text-align: justify; }

.business__area05 { position: relative; padding: 7vw 0 7vw; }
.business__area05 .inner-box { width: 90%; max-width: 1200px; margin: 0 auto; }
.business__area05 .inner-box .sub-ttl { margin: 0 0 30px; color: #00af85; border-color: #00af85; }
.business__area05 .inner-box .sub-ttl::after { border-bottom: solid 3px #ddd; }
.business__area05 .inner-box ul { display: flex; flex-wrap: wrap; padding: 0; list-style: none; }
.business__area05 .inner-box ul li { width: 49%; padding: 2em; margin-right: 2%; margin-bottom: 20px; background: #ededed; box-sizing: border-box; }
.business__area05 .inner-box ul li:nth-child(2n) { margin-right: 0; }
.business__area05 .inner-box ul li h4 { margin: 0; font-size: 1.3rem; }
.business__area05 .inner-box ul li h4 br { display: none; }
.business__area05 .inner-box ul li span { display: block; margin-top: 5px; text-indent: -9px; }
.business__area05 .inner-box ul li p { margin: 20px 0 0; }
.business__area05 .inner-box .img-box { display: flex; justify-content: space-between; }
.business__area05 .inner-box .img-box .item { width: 32%; }
.business__area05 .inner-box .img-box .item p { text-align: center; }

.item_wrap { display: flex; flex-wrap: wrap; padding: 60px 0 0; }
.item_wrap .item-box { width: 22%; margin-right: 4%; margin-bottom: 5%; }
.item_wrap .item-box:nth-child(4n) { margin-right: 0%; }
.item_wrap .item-box:nth-child(n+4) { margin-bottom: 0%; }
.item_wrap .item-box .item_img img { max-width: 100%; height: auto; }
.item_wrap .item-box .item_title { margin: 1rem 0; font-size: 1.3rem; text-align: left; }
.item_wrap .item-box .item_text { font-size: 0.9rem; font-weight: 500; line-height: 1.6rem; text-align: justify; }

.item_wrap .item-box dl { display: flex; flex-wrap: wrap; }
.item_wrap .item-box dl dt {
	width: 30%;
	font-size: 0.9rem;
	font-weight: 500;
	color: #222;
	text-align: left;
	text-align-last: justify;
}
.item_wrap .item-box dl dd {
	width: 70%;
	font-size: 0.9rem;
	font-weight: 500;
	color: #222;
	text-align: left;
}

.business__area06 .item_wrap .item-box { width: 48%; margin-right: 4%; margin-bottom: 5%; }
.business__area06 .item_wrap .item-box:nth-child(2n) { margin-right: 0; }
.business__area06 .item_wrap .item-box:nth-child(n+2) { margin-bottom: 0; }

.sec_img { width: 50%; }
.sec_img img { max-width: 100%; height: auto; vertical-align: bottom; }


/* 会社案内 */
.company__area01 { width: 90%; max-width: 1200px; margin: 0 auto; padding: 100px 0; }
.company__area01 .text-box { margin-top: 60px; }
.company__area01 .text-box:first-child { margin-top: 0; }
.company__area01 .text-box .ttl { font-size: calc(42 / 1200 * 100vw); }
.company__area01 .text-box p { font-size: 1.2rem; font-weight: 500; line-height: 2.5rem!important; }

.profile__img img { max-width: 100%; }

.company__area02 { width: 90%; max-width: 1200px; margin: 0 auto; padding: 40px 0 100px; }
.company__area02 .com-list { margin-top: 60px; }
.company__area02 .com-list dl { display: flex; line-height: 2em; font-size: .9em; }
.company__area02 .com-list dt {
	width: 200px;
    padding: 1.5em;
	font-size: 1rem;
    font-weight: 500;
    text-align: left;
    background: #f0f1f2;
    border-bottom: 3px #fff solid;
}
.company__area02 .com-list dd {
	width: 1000px;
	padding: 1.5em 1.5em;
	font-size: 1rem;
	line-height: 1.8rem;
	text-align: left;
	border-bottom: 3px #fff solid;
}
.company__area02 .com-list dd ul { list-style: none; padding: 0; margin: 0; }
.company__area02 .com-list p { box-sizing: border-box; line-height: 2em; }

.company__area02 .com-list ul.facility li { position: relative; padding: 0.3rem 1rem 0.3rem 1.2rem; border-bottom: 1px #ddd solid; }
.company__area02 .com-list ul.facility li::before {
	content: "・";
	position: absolute;
	top: 50%;
    left: 0%;
    transform: translateY(-50%);
}

.company__area02 .com-list.ss .award_item { width: 480px; margin: 0 auto 30px; }
.company__area02 .com-list.ss p { font-size: 1rem; text-align: center; }

.company__area02 .award_itemBox { display: flex; flex-wrap: wrap; justify-content: center; line-height: 0; }
.company__area02 .award_itemBox .award_item { width: 24%; margin-right: 1.33333%; margin-bottom: 15px; }
.company__area02 .award_itemBox .award_item:nth-child(4) { margin-right: 0; }
.company__area02 .award_itemBox .award_item:nth-child(7) { margin-right: 0; }
.company__area02 .award_itemBox .award_item p { line-height: 1.5rem; text-align: center; }

.company__area02 .award_item.main { width: 480px; margin: 0 auto 30px; text-align: center; }
.company__area02 .award_item.main p { font-size: 1.1rem; font-weight: bold; }

.company__area02 .achievements_itemBox { display: flex; flex-wrap: wrap; justify-content: center; line-height: 0; }
.company__area02 .achievements_itemBox .award_item { width: 32%; margin-right: 2%; margin-bottom: 15px; }
.company__area02 .achievements_itemBox .award_item:nth-child(3) { margin-right: 0; }
.company__area02 .achievements_itemBox .award_item p { line-height: 1.5rem; text-align: center; }

.company__area02 .bike_item.main { width: 700px; margin: 0 auto 30px; text-align: center; }
.company__area02 .bike_item.main p { font-size: 1.1rem; font-weight: bold; }

.company__area02 .bike_itemBox { display: flex; flex-wrap: wrap; justify-content: center; line-height: 0; }
.company__area02 .bike_itemBox .bike_item { width: 24%; margin-right: 1.33333%; margin-bottom: 15px; }
.company__area02 .bike_itemBox .bike_item:nth-child(4) { margin-right: 0; }

.company__area02 .bike_item.txt { margin-top: 10px; font-size: 1.4rem; font-weight: bold; color: #00af85; text-align: center; }

.bgwrap {
	background: #fff;
    position: relative;
}


/* 周辺観光案内 */
.sightseeing-spot {}
.sightseeing-spot .ttl { text-align: center; }
.sightseeing-spot .ttl_en { text-align: center; }
.sightseeing-spot .message { margin-bottom: 50px; text-align: center; }

.sightseeing-spot dl { padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px #ddd solid; }
.sightseeing-spot dl dt { font-weight: 600; }
.sightseeing-spot dl dd { margin-top: 5px; }
.sightseeing-spot dl dd a { text-decoration: none; }


/* お知らせ */
.news__area { width: 90%; max-width: 1200px; margin: 0 auto; padding: 100px 0; }
.news__area .news__list {}
.news__area .news__list dl { display: flex; flex-wrap: wrap; padding: 1.5em 0; border-bottom: 1px #ddd solid; }
.news__area .news__list dt { width: 10%; }
.news__area .news__list dd {}
.news__area .news__list dd a { text-decoration: none; color: #222; transition: 0.3s; }
.news__area .news__list dd a:hover { color: #00af85; }

.pagination { display: flex; justify-content: center; align-items: center; padding: 0; list-style: none; } 
.pagination .pagination-item-link-icon { width: 20px; margin-top: 0.5em; }
.pagination .pagination-item-link { color: #222; text-decoration: none; transition: 0.3s; }
.pagination .pagination-item-link span { padding: 0em 0.2em; margin: 0 0.2em; line-height: 1; }
.pagination .pagination-item-link.isActive span { color: #00af85; border-bottom: 1px #00af85 solid; }
.pagination .pagination-item-link:hover { color: #00af85; }

.news__area .area__date-time { text-align: right; }
.news__area .area__main-text {}

/* 20251024 */

.hours { margin-top: 30px; font-size: 1.5rem; font-weight: 600; color: #00af85; text-align: center; }
.hours-list { width: 320px; margin: 0 auto; font-size: 1.2rem; font-weight: 500; text-align: center; }
.hours-list .td02 { color: #0095d9; }
.hours-list .td03 { color: #e60033; }

/* Page Top */
#page-top {
	position: fixed;
	bottom: 20px;
	right: 20px;
	font-size: 0.9rem;
	font-weight: 600;
	line-height: 15px;
	text-align: center;
	z-index: 80;
}
#page-top a {
	display: block;
	width: 120px;
	padding: 12px 0px;
	color: #00af85;
	border-radius: 30px;
	text-decoration: none;
	transition: .3s;
	background-color: #fff;
}
#page-top a:hover { color: #fff; background-color: #00af85; }


/* ※BREADCRUMB LIST */
#bread {
	width: 100%;
	margin: 0 auto;
	padding: 12px 0px;
	font-size: 80%;
	text-align: left;
	background: #f5f5f5;
}
#bread a {
	text-decoration: none;
	position: relative;
	font-weight: 500;
	color: #353535;
}
#bread a:hover {
	color: #868686;
}

#bread-box { width: 90%; max-width: 1200px; margin: 0px auto; }
#bread-box .list-item {
	display: inline;
	position: relative;
	margin-left: 25px;
    line-height: 1.2;
	list-style-type: none;
}
#bread-box .list-item::before {
    content: '';
    display: block;
    width: 1px;
    height: 14px;
    position: absolute;
    left: -12px;
    top: 50%;
    transform: translateY(-50%) skew(-20deg);
    background: #282828;
}


/* 改行調整 */
@media screen and (min-width: 896px){
	.br-pc { display: block; }
	.br-sp { display: none; }
}
@media screen and (max-width: 896px){
	.br-pc { display: none; }
	.br-sp { display: block; }
}


/* ローディング */
#loading {
	transition: all 0.5s;
	background-color: #00af85;
	backdrop-filter: blur(10px);
	position: fixed;
	z-index: 9999;
	inset: 0;
	display: grid;
	place-items: center;
}
.loaded {
	opacity: 0;
	visibility: hidden;
}
.spinner {
	width: 40px;
	height: 40px;
	margin: 0 auto; /* 上下マージン - 可変 */
	position: relative;
}
.cube1, .cube2 {
	background-color: #fff; /* ベースの色 - 可変 */
	width: 15px;
	height: 15px;
	position: absolute;
	top: 0;
	left: 0;
	-webkit-animation: sk-cubemove 1.8s infinite ease-in-out;
	animation: sk-cubemove 1.8s infinite ease-in-out;
}
.cube2 {
	-webkit-animation-delay: -0.9s;
	animation-delay: -0.9s;
}

@-webkit-keyframes sk-cubemove {
	25% { -webkit-transform: translateX(42px) rotate(-90deg) scale(0.5) }
	50% { -webkit-transform: translateX(42px) translateY(42px) rotate(-180deg) }
	75% { -webkit-transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5) }
	100% { -webkit-transform: rotate(-360deg) }
}

@keyframes sk-cubemove {
	25% { 
		transform: translateX(42px) rotate(-90deg) scale(0.5);
		-webkit-transform: translateX(42px) rotate(-90deg) scale(0.5);
	} 50% { 
		transform: translateX(42px) translateY(42px) rotate(-179deg);
		-webkit-transform: translateX(42px) translateY(42px) rotate(-179deg);
	} 50.1% { 
		transform: translateX(42px) translateY(42px) rotate(-180deg);
		-webkit-transform: translateX(42px) translateY(42px) rotate(-180deg);
	} 75% { 
		transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);
		-webkit-transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);
	} 100% { 
		transform: rotate(-360deg);
		-webkit-transform: rotate(-360deg);
	}
}


/* スクロールアニメ関連CSS */
.border_h2 { position: relative; }
.border_h2 span {
	position: relative;
	display: inline-block;
	padding: 0.3vw 1vw 0.3vw;
}
.border_h2 span .border_x_left,
.border_h2 span .border_x_right,
.border_h2 span .border_y_top,
.border_h2 span .border_y_bottom {
	transition-delay: 0.3s;
}

.img_anim { overflow: hidden; }
.img_anim img { opacity: 0; transform: translateZ(0) scale(1.1); }
.img_anim.on img {
	opacity: 1;
	transition: transform 1s cubic-bezier(0.22, 0.11, 0.22, 1) 0.5s, opacity 1s cubic-bezier(0.22, 0.11, 0.22, 1) 0.5s;
	transform: translateZ(0) scale(1);
	width: 100%;
}

.text_b { filter: blur(20px); opacity: 0; }
.text_b.on {
	filter: blur(0);
	opacity: 1;
	transition: filter 0.6s cubic-bezier(0.65, 0.05, 0.36, 1), opacity 0.6s cubic-bezier(0.65, 0.05, 0.36, 1);
}

.fade_y, .text {
	transform: translateY(10%);
	opacity: 0;
}
.fade_y.on, .text.on {
	opacity: 1;
	transform: translateY(0%);
	transition: 0.5s;
}

.border_y_top {
	height: 100%;
	width: 1px;
	position: absolute;
	left: 0;
	top: 0;
	transform: scaleY(0);
	transform-origin: top;
	background: #00af85;
	transition: transform 0.9s cubic-bezier(0, 1.08, 1, 1);
	z-index: 1;
}
.border_y_bottom {
	height: 100%;
	width: 1px;
	position: absolute;
	right: 0;
	top: 0;
	transform: scaleY(0);
	transform-origin: bottom;
	background: #00af85;
	transition: transform 0.9s cubic-bezier(0, 1.08, 1, 1);
	z-index: 1;
}
.border_x_left {
	position: absolute;
	right: 0;
	top: 0;
	height: 1px;
	width: 100%;
	transform: scaleX(0);
	transform-origin: left;
	background: #00af85;
	transition: transform 1s cubic-bezier(0, 1.08, 1, 1);
	z-index: 1;
}
.border_x_right {
	position: absolute;
	right: 0;
	bottom: 0;
	height: 1px;
	width: 100%;
	transform: scaleX(0);
	transform-origin: right;
	background: #00af85;
	transition: transform 1s cubic-bezier(0, 1.08, 1, 1);
	z-index: 1;
}

#bar {
	background-color: #00af85;
	position: fixed;
	top: 0;
	left: 0;
	height: 7px;
	z-index: 9999;
}