/* pc size */
.top_page .logo_container {
	margin-top: 54px;
    margin-bottom: 50px;
}



/* 共通要素
--------------------------------------------------*/
body.sp {
	min-width: auto;
}

.sp article {
	width: 100%;
	position: relative;
	margin-top: calc(100vw * 0.68);
	padding: 45px 25px 0 25px;
	z-index: 100;
}

.sp .wrapper {
	position: relative;
}

.sp .container1 {
	width: 100%;
}

.sp .container2 {
	width: 100%;
}

.sp .page_title {
	font-size: 23px;
	letter-spacing: 0.12em;
	white-space: nowrap;
}

/* .sp .description {
	font-size: 13px;
} */
.sp .description {
	font-size: 14px;
}

.sp .top_page .summary .copy {
	letter-spacing: 0.12em;
}

.sp .cover_top {
	position: fixed;
	height: 100vw;
}

.sp .cover_top.hide,
.sp .cover_top.hide .copy {
	visibility: hidden;
}

.sp .cover_top aside {
	position: absolute;
}

.sp .onlinestore {
	position: fixed;
	width: 100%;
	height: 50px;
	left: auto;
	right: 0;
	padding-top: 3px;
	z-index: 200;
	height: calc(50px + env(safe-area-inset-bottom));
}

.sp .onlinestore img {
	width: 138px;
	margin-top: 12px;
}

@media screen and (max-width: 1100px) {
	.sp aside {
		left: 0;
		width: 100%;
	}
}

.sp aside .bamboo_area {
	position: relative;
	height: calc(100vw  * 0.68);
}

.sp aside .bamboo_area.hide,
.sp aside .bamboo_area.hide .copy {
	visibility: hidden;
}

.sp aside .bamboo_area .copy {
	top: calc((100% + 30px) / 2);
	right: 20px;
	left: auto;
	transform: translateY(-50%);
	font-size: 14px;
	letter-spacing: 0.2em;
	white-space: nowrap;
}
.sp aside .bamboo_area .copy.period {
	padding: 15px 0 0;
}

.sp .wp-pagenavi {
	margin: 65px 0 0 0;
	padding-bottom: 92px;
}

.sp .wp-pagenavi .previouspostslink,
.sp .wp-pagenavi .nextpostslink {
	top: 0;
}

.sp .wp-pagenavi span,
.sp .wp-pagenavi a {
	margin: 0 11px;
	padding: 0 4px 4px;
	font-size: 13px;
}

.sp .scrolldown {
	display: none;
}

.sp .button {
	padding: 24px 34px 21px 31px;
	font-size: 16px;
}

.sp .works_list li {
	width: calc(100% / 2);
	margin-top: 0;
	margin-left: 0;
	padding: 0;
}

.sp .works_list li:nth-child(n+3) {
	margin-top: 40px;
}

.sp .works_list .frame {
	margin: 0 0 0 auto;
	transform: scale(0.9);
	transform-origin: right;
}

.sp .works_list .title {
	left: 18px;
}

.sp .logo_container {
	width: 100%;
	margin-top: 20px;
}

.sp .logo_container .logo_list {
	justify-content: space-between;
}

.sp .logo_container .logo_list::after {
	content: "";
	display: block;
	width: calc((100% - 60px) / 3);
	margin: 12px 10px;
}

.sp .logo_container .logo_list li {
	width: calc((100% - 60px) / 3);
    margin: 12px 10px;
}

.sp .logo_container .frame {
	width: 100% !important;
	height: auto !important;
}


/* HEADER
--------------------------------------------------*/
.sp header {
	width: 100%;
	height: 60px;
	top: 0;
	left: 0;
	padding: 0;
	background-color: transparent;

	/* display: none; */
}

.sp header .gnav_container {
	width: 100%;
	height: 100vh;
	position: relative;
	margin: 0;
	background-color: #fff;
}

.sp header .gnav_list {
	position: absolute;
	top: 38%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: left;
}

.sp header .gnav_container li {
	display: block;
	margin-top: 0;
	padding: 0 16px;
	font-size: 16px;
}

.sp header .logo {
	position: absolute;
	top: 20px;
	right: 20px;
}

.sp header .wmvrl {
	/* writing-mode: horizontal-tb; */
}


.sp header .gnav_container li a:after,
.sp header .gnav_container .current_nav:after {
	display: none;
}



/* MENU BAR
--------------------------------------------------*/

.sp .menu {
	top: 8px;
    left: 10px;
}

.sp .menu .menu_bar {
	height: 2px;
}

.sp .menu .menu_bar:nth-of-type(1) {
    top: 17px;
}

.sp .menu .menu_bar:nth-of-type(2) {
	display: none;
}
.sp .menu .menu_bar {
	width: 24px;
}
.sp .menu .menu_bar:nth-of-type(3) {
    top: 25px;
}


@keyframes active_menu_bar1 {
	0% { transform: translateY(0) rotate(0); }
   50% { transform: translateY(4px) rotate(0); }
  100% { transform: translateY(4px) rotate(45deg); }
}

@keyframes active_menu_bar3 {
	0% { transform: translateY(0) rotate(0); }
   50% { transform: translateY(-4px) rotate(0); }
  100% { transform: translateY(-4px) rotate(-45deg); }
}



/* FOOTER
--------------------------------------------------*/
.sp footer {
	width: 100%;
}

.sp footer .footer_container {
	padding: 60px 25px 80px 25px;
}
.sp.iphonex footer .footer_container {
	padding: 60px 25px 104px 25px;
}


.sp footer h1 {
	font-size: 15px;
	letter-spacing: 0.14em;
}

.sp footer .info_container {
	width: 100%;
	margin-bottom: 72px;
}

.sp footer .info {
	font-size: 13px;
	letter-spacing: 0.12em;
}

.sp footer .copyright {
	position: static;
	font-size: 10px;
}



/* TOP PAGE
--------------------------------------------------*/
.sp .top_aside .bamboo_area {
	height: 100%;
}

.sp .top_aside .bamboo_area .copy {
	top: calc(100vw * 0.5);
	right: auto;
	left: 50%;
	transform: translate(-50%, -50%);
}

.sp article.top_page {
	margin-top: 100vw;
	padding: 44px 25px 60px 25px;
}

.sp .top_page .summary .copy {
	font-size: 23px;
}

.sp .top_page .summary .description_container {
	margin-top: 32px;
}

.sp .top_page .summary .description {
	font-size: 14px;
    line-height: 1.9;
	transform: scaleX(0.9) translate(-56%, 0);
}

.sp .top_page .youtube {
	margin-top: 20px;
}

.sp .top_page .news {
	margin-top: 64px;
	padding: 0 0;
}

.sp .top_page .news .sec_title,
.sp .top_page .works .sec_title {
	font-size: 23px;
	letter-spacing: 0.12em;
}

.sp .top_page .news_list {
	margin-top: 10px;
}

.sp .top_page .news .more.text {
	margin-top: 28px;
}

.sp .top_page .news .more.text a {
	font-size: 14px;
}

.sp .top_page .works {
	margin-top: 65px;
}

.sp .top_page .works_list {
	margin-top: 0;
}

.sp .top_page .works .more {
	margin-top: 12px;
}

.sp .top_page .logo_container {
	margin-bottom: 20px;
}


/* ABOUT PAGE
--------------------------------------------------*/
.sp .about_page {
	padding-bottom: 60px;
}

.sp .about_page .summary {
	margin-top: 50px;
}

.sp .about_page .outline_list {
	width: 100%;
}

.sp .about_page .summary .signature {
	font-size: 14px;
}

.sp .about_page .summary .signature small {
	font-size: 12px;
}

.sp .about_page .summary .button {
	margin-top: 32px;
}

.sp .about_page .history {
	margin-top: 64px;
}

.sp .about_page .history .sec_title,
.sp .about_page .outline .sec_title {
	font-size: 16px;
}

.sp .about_page .history .sec_title {
	margin-top: 45px;
}

.sp .about_page .history_list {
	margin-top: 38px;
}

.sp .about_page .history_list .left {
	width: 27.7%;
    padding: 0 22px 0 0;
    font-size: 12px;
	white-space: nowrap;
}

.sp .about_page .history_list .dot {
	left: 27.5%;
}

.sp .about_page .history_list .right {
	width: 72.2%;
    padding: 0 0 35px 22px;
    font-size: 13px;
    letter-spacing: 0.07em;
}

.sp .about_page .outline {
	margin-top: 64px;
}

.sp .about_page .outline .sec_title {
	margin-top: 45px;
}

.sp .about_page .outline_list {
	margin-top: 20px;
}

.sp .about_page .outline_list dt,
.sp .about_page .outline_list dd {
	font-size: 13px;
}

.sp .about_page .outline_list dt {
	width: 27%;
}

.sp .about_page .outline_list dd {
	width: 73%;
	letter-spacing: 0.07em;
}

.sp .about_page .map {
	margin-top: 36px;
}


/* WORKS PAGE
--------------------------------------------------*/
.sp .works_page {
	padding-bottom: 30px;
}

 .sp .works_page .logo_container {
	 margin-top: 40px;
 }

 .sp .works_page .works_list {
	 margin-top: 24px;
 }

 .sp .works_page .tag {
	margin: 40px 0 18px;
	font-size: 16px;
 }


 /* WORKS SINGLE
--------------------------------------------------*/
.sp .works_single {
	padding: 0 0 60px;
}

.sp .works_single .cover .back {
	opacity: 0;
}

@media screen and (max-width: 1100px) {
	/* .sp.single-works aside {
		position: absolute;
		z-index: 200;
		background-color: transparent;
		pointer-events: none;
	} */

	.sp .works_single .cover {
		display: none;
	}

	.sp .works_single_cover {
		height: auto;
	}
}

.sp .works_single_aside .bamboo_area .copy {
	/* top: calc((100% + 30px) / 2); */
	/* right: 23px; */
	/* transform: translate(0, -50%); */
	padding: 14px 0 12px;
	z-index: 150 !important;
}

.sp .works_single_aside .bamboo_area .copy small {
	margin-top: 12px;
	font-size: 0.77em;
	transform: translateX(-0.2px);
}

.sp .works_slide .swiper-pagination-bullets {
	bottom: 12px;
	left: 50%;
}

.sp .works_single .content p {
	width: 100%;
	font-size: 14px;
}

.sp .works_single .works_innner {
	padding: 26px 25px 0;
}

.sp .works_single .information {
	margin-top: 40px;
}

.sp .works_single .contact {
	margin-top: 40px;
}

.sp .works_single .tags_list {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
}

.sp .works_single .tags {
	margin-left: 10px;
}

.sp .works_single .tags a {
	font-size: 12px;
	color: #000;
	padding-bottom: 5px;
    border-bottom: 1px solid #333333;
	text-decoration: none;
}

.sp .works_single .tags_list + p {
	margin-top: 30px;
}

.sp .works_single .back_wrap {
	margin-top: 50px;
	text-align: center;
}


.sp .works_single .back_wrap a {
	font-size: 14px;
}

/* TAXONOMY PAGE
--------------------------------------------------*/

.sp .taxonomy_page {
	margin-top: 0;
	padding-top: 104px;
}


/* NEWS PAGE
--------------------------------------------------*/
.sp .news_page {
	padding-bottom: 0;
}

.sp .news_page .news {
	margin-top: 50px;
	padding: 0;
}

.sp .news_list li:not(:first-child) {
	margin-top: 13px;
}

.sp .news_list li a {
	flex-wrap: wrap;
	padding: 10px 0 7px;
}

.sp .news_list li .date,
.sp .news_list li .cat,
.sp .news_list li .title {
	font-size: 14px;
	letter-spacing: 0.07em;
}

.sp .news_list li .date,
.sp .news_list li .cat {
	font-size: 11px;
}

.sp .news_list li .date {
	width: 67px;
    margin-right: 8px;
    position: relative;
}
.sp .news_list li .date::after {
	content: "";
    display: block;
	width: 1px;
    height: 12px;
    position: absolute;
    top: 50%;
	right: 0;
    transform: translateY(-50%);
    background-color: #000;
}

.sp .news_list li .title {
	line-height: 1.7;
	margin-top: 2px;
}



/* NEWS SINGLE
--------------------------------------------------*/
.sp .news_single {
	margin-top: 0;
	padding-top: 100px;
	padding-bottom: 140px;
}

.sp .news_single .info .date,
.sp .news_single .info .cat {
	font-size: 12px;
	letter-spacing: 0.07em;
}

.sp .news_single .page_title {
	font-size: 18px;
	letter-spacing: 0.07em;
	white-space: normal;
}

.sp .news_single .news {
	margin-top: 30px;
}

.sp .news_single .news p {
	font-size: 14px;
	letter-spacing: 0.07em;
}
.sp .news_single .news *+p {
	margin-top: 18px;
}

.sp .news_single .back {
    top: 100%;
    right: auto;
    left: 50%;
    transform: translate(-50%, calc(-100% - 74px));
	font-size: 14px;
}

.sp .news_single .back.wmvrl {
	writing-mode: horizontal-tb;
}

.sp .news_single .controller {
	margin-top: 52px;
}

.sp .news_single .controller_next {
	/* left: 24px; */
	/* right: 0; */
}

.sp .news_single .controller_prev {
	/* right: 24px; */
	/* left: 0; */
}

.sp .news_single .controller_next a,
.sp .news_single .controller_prev a {
	font-size: 14px;
}


/* OEM PAGE
--------------------------------------------------*/
.sp .oem_page {
	padding-bottom: 52px;
}

.sp .oem_page .summary {
	padding-top: 60px;
}

.sp .oem_page .sec_title {
	font-size: 18px;
}

.sp summary .frame {
	margin: 32px 0;
	transform: scale(1);
}

.sp .oem_page .summary .sec_title+.description {
	margin-top: 40px;
}

.sp .oem_page .variation .sec_title+.description {
	width: 100%;
}

.sp .oem_page .variation section .description {
	width: 100%;
}

.sp .oem_page .cycle {
	padding: 34px 0 30px;
}

.sp .oem_page .cycle .sec_title span {
	padding-bottom: 6px;
}

.sp .oem_page .flow {
	padding: 34px 0 30px;
}

.sp .oem_page .flow .sec_title+.description {
	margin-top: 28px;
}

.sp .oem_page .flow_list {
	margin-top: 48px;
}

.sp .oem_page .flow_list li {
	width: calc((100% - 18px) / 2);
}

.sp .oem_page .flow_list .num {
    top: -12px;
    left: -12px;
    width: 24px;
    height: 24px;
    font-size: 13px;
    line-height: 24px;
}

.sp .oem_page .flow_list .title {
    margin-top: 16px;
    font-size: 15px;
}

.sp .oem_page .flow_list .description {
	margin-top: 13px;
	font-size: 12px;
}

.sp .oem_page .flow_list li:nth-child(n+3) {
    margin-top: 22px;
}

.sp .oem_page .variation {
	padding: 34px 0 30px;
}

.sp .oem_page .variation .sec_title+.description {
	margin-top: 48px;
}

.sp .oem_page .variation section {
	padding: 60px 0 30px;
}

.sp .oem_page .variation section .sec_title {
	top: 18px;
    right: 14px;
    font-size: 25px;
}

.sp .oem_page .variation section .description {
	margin: 30px auto 0;
	font-size: 14px;
}

.sp .oem_page .shape_list {
    margin: -22px auto 0;
}

.sp .oem_page .shape_list p {
	font-size: 18px;
	white-space: nowrap;
}

.sp .oem_page .thickness_list p {
	top: 74px;
    left: 4px;
    font-size: 13px;
}

.sp .oem_page .thickness_list p span {
	margin-top: 8px;
    font-size: 11px;
}

.sp .oem_page .length .swiper-slide img {
	width: 100%;
	height: auto;
}

.sp .oem_page .length_slide {
	padding-bottom: 32px;
}

.sp .oem_page .length_slide p {
	bottom: 3px;
    left: 9px;
    font-size: 12px;
	white-space: nowrap;
}

.sp .oem_page .length_slide .swiper-pagination:before {
	margin-right: 18px;
}
.sp .oem_page .length_slide .swiper-pagination:after {
    margin-left: 18px;
}

.sp .oem_page .paint .swiper-slide,
.sp .oem_page .option .swiper-slide {
	width: 33%;
}

.sp .oem_page .paint .swiper-slide img,
.sp .oem_page .option .swiper-slide img,
.sp .oem_page .quality .swiper-slide img {
	width: 100%;
	height: auto;
}

.sp .oem_page .option .swiper-slide {
	width: 100%;
}

.sp .oem_page .paint_list li {
	width: 33%;
}

.sp .oem_page .paint_list p {
	bottom: 11px;
    left: 4px;
    font-size: 13px;
}

.sp .oem_page .paint_list p span {
	margin-top: 8px;
    font-size: 11px;
}

.sp .oem_page .color_list {
	justify-content: center;
	width: 100%;
}

.sp .oem_page .color_list li {
	width: calc((100% - 66px) / 8);
}

.sp .oem_page .color_list li img {
	width: 100%;
}

.sp .oem_page .option_list li {
	width: 50%;
}

.sp .oem_page .quality {
	padding: 60px 0 0 !important;
}

.sp .oem_page .contact .sec_title+.description {
	margin-top: 30px;
}

.sp .oem_page .contact .wpcf7 {
	margin-top: 48px;
}


.sp .oem_page .contact .form_container {
	margin-top: 22px;
}

.sp .oem_page .contact .wpcf7 .title {
	font-size: 14px;
}

.sp .oem_page select {
	width: 100%;
	padding: 12px 35px 12px 11px;
}
.sp .oem_page .contact-type:before {
	width: 8px;
    height: 8px;
}

.sp .oem_page .document .frame,
.sp .oem_page .document .description {
	width: 100%;
	margin: 30px auto 0;
}

.sp .oem_page .document .document_inner {
	padding: 30px 25px 40px;
}

.sp .oem_page .document .description {
	margin-top: 18px;
}

.sp .oem_page .document .wpcf7-list-item-label,
.sp .oem_page .accept .wpcf7-list-item-label {
	padding-left: 31px;
    font-size: 16px;
}

.sp .oem_page .submit {
	margin-top: 40px;
}

.sp .oem_page input[type="submit"] {
	padding: 26px 8px 23px 8px;
    font-size: 17px;
}

.sp .oem_page .wpcf7-response-output {
	font-size: 12px;
	line-height: 2;
	margin: 0.6em 0 3em 0 !important;
	padding: 0;
	color: #dc3232;
}


/* DEALERS SINGLE
--------------------------------------------------*/
.sp .dealers_page {
	padding-bottom: 60px;
}

.sp .dealers_page .dealers {
	padding: 0 0;
}

.sp .dealers_page .dealers_area:not(:first-of-type) {
	margin-top: 60px;
}

.sp .dealers_page .note {
	top: -1px;
	font-size: 13px;
}

.sp .dealers_page .area_title {
	font-size: 18px;
}

.sp .dealers_page .dealers_list {
	margin-top: 8px;
}

.sp .dealers_page .dealers_list li {
	padding: 5px 0 5px;
}
.sp .dealers_page .dealers_list li:not(:first-child) {
	margin-top: 8px;
}

.sp .dealers_page .dealers_list li .title {
	font-size: 13px;
    letter-spacing: 0.07em;
}

.sp .dealers_page .dealers_list li .address {
	margin-top: 6px;
	font-size: 13px;
    letter-spacing: 0.07em;
}

.sp .dealers_page .dealers_list li .tel {
	font-size: 13px;
	letter-spacing: 0.07em;
}

.sp .dealers_page .dealers_list li.okaeri:after {
	bottom: 11px;
    width: 18px;
    height: 8px;
}


@media screen and (max-width:320px) {
	.sp .button {
		font-size: 13px;
	}
	
	.sp .onlinestore.scroll {
		bottom: 351px;
	}

	.sp .oem_page .sec_title {
		font-size: 17px;
	}

	.sp .top_page .summary .description {
		font-size: 12px;
		transform: scaleX(0.9) translate(-55%, 0);
	}

	.sp aside .bamboo_area .copy {
		font-size: 13px;
	}

	.sp .oem_page .thickness_list p {
		top: 55px;
		left: 4px;
		font-size: 12px;
		white-space: nowrap;
	}

	.sp .oem_page .length_slide p {
		bottom: 3px;
		left: 7px;
		font-size: 11px;
	}

	.sp .oem_page .paint_list p {
		bottom: 8px;
		left: 2px;
		font-size: 11px;
	}

	.sp .about_page .outline_list dt,
	.sp .about_page .outline_list dd {
		font-size: 12px;
	}

	.sp .about_page .outline_list dt {
		width: 30%;
	}

	.sp .about_page .outline_list dd {
		width: 70%;
	}
}