/*
Theme Name: suntoplogi
*/


.material-symbols-outlined {
  font-variation-settings:
  'FILL' 0,
  'wght' 100,
  'GRAD' 0,
  'opsz' 24
}

*{
	box-sizing:border-box;
}

html{
	background-color:#fff;
	font-size:15px;
	line-height:1.5;
	box-sizing:border-box;
}

@media screen and (max-width: 576px) {
	html{
		font-size:14px;
	}
}


body{
	font-family: quasimoda, "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif;
	font-style: normal;
	font-weight:400;
	display:flex;
	flex-direction:column;
	min-height:100vh;
	overflow-x:clip;
}

main{
	flex:1;
	padding:5.5rem 0 0 0;
}

body.home main{
	padding:0!important;
}

img {
	max-width:100%;
}

a{
	color:#646464;
}

.icon-external{
	position:relative;
	line-height:1;

}

.icon-external:after{
	position:absolute;
	content:'';
	display:inline-block;
	width:1em;
	height:1em;
	background-image:url(images/common/icon-external-black.svg);
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:contain;
	top:50%;
	transform:translate(0.2em , -50%);
}

.icon-external.white:after{
	background-image:url(images/common/icon-external-white.svg);
}

.full-width{
	width:100vw;
	margin:0 calc(50% - 50vw);
}

#home-logo img{
	width:136px;
}

@media screen and (max-width:576px) {
	#home-logo img{
		width:78px;
	}
}

button.pum-close.popmake-close{
	display:none;
}

.pum-container{
	max-width:80vw!important;
	display:flex;
	justify-content:center;
}

.btn-red{
	background-color:rgba(185,25,75,1);
	padding:0.15em 0.25em;
	color:#fff!important;
	display:inline-block;
	border-radius:0.25em;
	transition:all 0.3s ease;
}

.btn-red:hover{
	background-color:rgba(185,25,75,0.75);
}

.btn-red.inverse{
	color:rgba(185,25,75,1)!important;
	background-color:#fff;
}

.btn-red.inverse:hover{
	background-color:rgba(255,255,255,0.75);
}



.btn-blue{
	background-color:rgba(85,212,255,1);
	padding:0.15em 0.25em;
	color:#fff;
	display:inline-block;
	border-radius:0.25em;
	transition:all 0.3s ease;
}

.btn-blue:hover{
	background-color:rgba(85,212,2555,0.75);
}

.btn-grey{
	background-color:rgba(225,225,225,1);
	padding:0.15em 0.25em;
	color:#000;
	display:inline-block;
	border-radius:0.25em;
	transition:all 0.3s ease;
	position:relative;
}

.btn-grey:hover{
	background-color:rgba(225,225,225,0.75);
}



.bg-darkgrey{
	background-color:rgba(100,100,100,1);
	color:#fff;
}


.bg-grey{
	background-color:rgba(139,125,126,0.1);
}

.text-red{
	color:#b9194b;
}

ol.basic{
	list-style-type:decimal;
	margin:0 0 0 1.3rem;
}

ol.basic li{
	margin:0 0 0.5rem;
}

ul.basic{
	list-style-type:disc;
	margin:0 0 0 1.3rem;
}

ul.basic li{
	margin:0 0 0.5rem;
}

ul.basic li:last-child{
	margin:0 0 0;
}


ol.kakko{
	margin:0 0 0 1.75rem;
}

ol.kakko li {
  position: relative;
  list-style-type: none;
}

ol.kakko li:before {
  position: absolute;
  right: calc(100% + 0.5rem);
  content: "(" counter(list-item) ")";
}

/* ________________________________________
 * Header
 * ________________________________________ */
header.global{
/*	margin:20px 0;*/
	padding:20px 0;
	z-index:5;
	position:fixed;
	width:100%;
	transition: all 0.3s ease;
}

header.scrolled{
/*	margin:7px 0;*/
	padding:7px 0;
}

.head__container {
	height:60px;
	display:flex;
	flex-direction:row;
	justify-content:flex-end;
}
/*
header nav{
	background-color:#fff;
	border-radius:100vh;
	box-shadow:0px 3px 6px rgba(0,0,0,0.25);
	display:flex;
	justify-content:space-between;
	align-items:center;
	flex:1;
	margin-right:1rem;
	padding-right:1.5rem;
	padding-left:1.5rem;
}



header nav .head__nav{
	flex:1;
	display:flex;
	justify-content:flex-end;
	opacity:1;
	pointer-events:auto;
	transition:all 0.3s ease;
}
*/


header nav .head__nav.is-hidden{
	opacity:0;
	pointer-events:none;
}

header nav .head__nav ul{
	display:flex;
}

header nav .head__nav ul li {
	margin-right:2.75rem;
}

header nav .head__nav ul li a div:nth-child(1){
	font-size:1.1rem;
	letter-spacing:0.05em;
	margin:0 0 0.3em;

}


header nav .head__nav ul li a div:nth-child(2){
	font-size:0.85rem;
}

header  .head__hamburger{
	width:60px;
	height:60px;
	position:relative;
	display:flex;
	align-items:center;
	justify-content:center;
	cursor:pointer;
	background-color:#fff;
	border-radius:100vh;
	transition:all 0.3s ease;
}



header.scrolled  .head__hamburger{
	box-shadow:0px 2px 4px rgba(0,0,0,0.25);
}

header  .head__hamburger span{
	width:30px;
	height:1px;
	background-color:#b9194b;
	display:block;
	position:absolute;
	transition:all 0.3s ease;
}

body.is-active  .head__hamburger{
	background-color:transparent;
	box-shadow:0 0 0 transparent;
}

body.is-active header  .head__hamburger span{
	background-color:#fff;
}



header  .head__hamburger span:nth-child(1){
	transform:translatey(-10px);
}

header  .head__hamburger span:nth-child(3){
	transform:translatey(10px);
}


header  .head__hamburger.is-active span:nth-child(2){
	opacity:0;
}

header  .head__hamburger.is-active span:nth-child(1){
	transform:translatey(0) rotate(45deg);
}

header  .head__hamburger.is-active span:nth-child(3){
	transform:translatey(0) rotate(-45deg);
}

header  .head__drawer{
	z-index:9999;
}
header  .head__dropdown{
	position:absolute;
	top:0;
	right:0;
	z-index:-1;
	width:100vw;
	height:100vh;
	background-color:rgba(185,25,75,0.9);
	padding:2.25rem 1.5rem;
	transform:translatey(-5rem);
	opacity:0;
	transition:opacity 0.45s ease, transform 0.45s ease 0.2s;
	pointer-events:none;
}

header  .head__dropdown.is-active{
	transform:translatey(0);
	opacity:1;
	transition:opacity 0.45s ease 0.2s, transform 0.45s ease;
	pointer-events:auto;
}

header  .head__dropdown ul.head__dropdown--list{
	margin:0 0 1.5rem;
}

header  .head__dropdown ul.head__dropdown--list li{
	padding:0.75em 0;
}

header  .head__dropdown ul.head__dropdown--list li a{
	color:#fff;
}


header  .head__dropdown ul.head__dropdown--list li a div:nth-child(1){
	font-size:1.1rem;
	letter-spacing:0.05em;
	margin:0 0 0.3em;
}

header  .head__dropdown ul.head__dropdown--list li a div:nth-child(2){
	font-size:0.85rem;
}


header  .head__dropdown ul.head__dropdown--sns{
	display:flex;
	justify-content:space-evenly;
	margin:0 0 1.5rem;
}


.head__reservation{

}

.head__reservation a{
	height:100%;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	padding-right:2.5rem;
	padding-left:2.5rem;
	background-color:#92181E;
	color:#fff;
	border-radius:100vh;
	text-decoration:none;
	box-shadow:0px 3px 6px rgba(0,0,0,0.25);
}

.head__reservation a div:nth-child(1){
	font-size:1.1rem;
	letter-spacing:0.05em;
	transform:translatex(-0.5em);
	margin:0 0 0.3em;
}

.head__reservation a div:nth-child(2){
	font-size:0.85rem;
}


@media screen and (max-width: 1200px) {
	header nav .head__logo{
	width:200px;
}

	header nav .head__nav{
		display:none;
	}
}

@media screen and (max-width: 576px) {


	
	header nav{
		margin:0;
		transition: width .25s ease 0.6s;
		padding-right:1rem;
		padding-left:1rem;
		width:50%;
		flex:0 1 auto;
		position:relative;
	}
	header nav .head__drawer{
		position:static;
	}

	header nav + .head__reservation{
		margin:0 0.6rem 0 0;
		transition:opacity 0.2s ease 1.2s, transform 0.2s ease 1.2s, width 0.3s linear 0.65s, margin 0s ease 0.9s;
		width:50%;
	}
	
	body.is-active header nav{
		width:100%;
		transition: width .3s ease 0.4s;
	}
	body.is-active  header nav + .head__reservation{
		margin:0;
		opacity:0;
		transform:translatex(-100%);
		width:0;
		transition:opacity 0.2s ease, transform 0.2s ease, width 0.2s ease 0.4s;
	}
	
	header nav .head__logo{
		width:100px;
		max-width:100%;
		margin-right:auto;
		margin-left:auto;
		transform:translatex(12px);
	}

	
header nav + .head__reservation a{
	padding-right:1.25rem;
	padding-left:1.25rem;
	}

header nav + .head__reservation a div:nth-child(1){
	font-size:0.7rem;
	letter-spacing:0.05em;
	transform:translatex(-0.5em);
	margin:0 0 0.3em;
}

header nav + .head__reservation a div:nth-child(2){
	font-size:1rem;
}


	header nav .head__dropdown{
		position:absolute;
		top:auto;
		bottom:1rem;
		right:1%;
		z-index:-1;
		width:98%;
		display:block;
		transform:translatey(1.5rem);
transition:opacity 0.25s ease, transform 0.25s ease;
		border-bottom-left-radius:0;
		border-bottom-right-radius:0;
		padding-bottom:3rem;
	}

	header nav .head__dropdown.is-active{
		transform:translatey(-1.5rem);
		opacity:1;
		transition:opacity 0.45s ease 0.6s, transform 0.45s ease 0.6s;
		pointer-events:auto;
	}

}

 
.menu {
max-width:90vw;
	width:30rem;
position:relative;
}
.menu .menu-item {}
.menu .menu-item  .menu-item-btn {
      display: flex;
      align-items: center;
      justify-content: flex-start;
      background-color: transparent;
      cursor: pointer;
	color:#fff;
	font-size:1.5rem;
	font-weight:bold;
	padding:0.75rem 0;
	position:relative;
}

.menu .menu-item  .menu-item-btn:before {
	font-family:'Material Symbols Outlined';
	content:'\e313';
	display:inline-block;
	font-weight:100!important;
	color:#fff;
	font-size:2.5rem!important;
	display:flex;
	align-items:center;
	justify-content:center;
	margin-right:0.25rem;	
	transition:all 0.3s ease;
	transform-origin:50% 50%;
}

.menu .menu-item  .menu-item-btn.active:before{
	transform:rotate(540deg);
}


    
.menu .menu-item ul {
      display: none;
	margin:0 0 1.5rem 3.25rem;
}
 .menu .menu-item ul li {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        background-color: transparent;
      }
.menu .menu-item ul li a{
	color:#fff;
	padding:0.75rem 0;
}


/* ________________________________________
 * Footer
 * ________________________________________ */

footer{
	background-color:#8b7d7e;
	padding:4.5rem 0;
	color:#fff;
}

footer a{
	color:#fff;
}

footer h3{
	font-size:1.45rem;
	font-weight:500;
	margin:0 0 1.5rem;
	letter-spacing:0.075em;
}

footer ul.footer__menu li{
	margin:0 0 1rem;
}

.footer__logo{
	width:400px;
	max-width:90vw;
	margin:1rem auto 2.5rem auto;
}

.footer__nav{
	display:flex;
	flex-wrap:wrap;
	gap:1.25rem;
}

.footer__nav > div{
	width:calc(25% - 1rem);
}

ul.footer__nav--menu{
	margin:0 0 2.25rem;
}

ul.footer__nav--menu li a div:nth-child(1){
	font-size:1.1rem;
	letter-spacing:0.05em;
	margin:0 0 0.3em;
}

ul.footer__nav--menu li a div:nth-child(2){
	font-size:0.85rem;
}

.footer__nav--sns{
	display:flex;
	justify-content:space-evenly;
	margin:0 0 2.5rem;
}

.footer__copyright {
	text-align:center;
	margin:0 0 1rem;
}

footer .contact__button-container{
	display:flex;
	align-items:flex-start;
}



footer .contact__button{
	display:flex;
	align-items:center;
	background-color:#fff;
	padding:1rem;
	border-radius:0.75rem;
	color:#b9194b;
	font-weight:bold;
	letter-spacing:0.05em;
	font-size:1.25rem;
	box-shadow:2px 2px 0px rgba(0,0,0,0.3);
	position:relative;
	transition:all 0.3s ease;
}

footer .contact__button:before{
	font-family:'Material Symbols Outlined';
	content:'\e5c8';
	display:inline-block;
	font-weight:100!important;
	color:#fff;
	background-color:#b9194b;
	border-radius:100vh;
	width:1.5rem;
	height:1.5rem;
	font-size:1.5rem!important;
	display:flex;
	align-items:center;
	justify-content:center;
	margin-right:0.5rem;	
	transition:all 0.3s ease;
}

footer .contact__button:hover:before{
	background-color:rgba(185,25,75,0.7);
}
footer .contact__button:hover{
	color:rgba(185,25,75,0.7);
	background-color:rgba(255,255,255,0.75)
}

footer .material-symbols-outlined {
  font-variation-settings:
  'FILL' 0,
  'wght' 100,
  'GRAD' 0,
  'opsz' 24
}

@media screen and (max-width: 992px) {

	.footer__nav > div{
		width:calc(100%);
	}

}

/* ________________________________________
 * Main
 * ________________________________________ */

main{

}


@media screen and (max-width: 576px) {
	main{
	padding-top:3.5rem;
	}

}


/* ------------------------------------------------------------
 * Front Page
 * ------------------------------------------------------------ */

.transition__container{
	position:fixed;
	width:100%;
	height:100%;
	overflow:hidden;
	z-index:9999;
	pointer-events:none;
}

.transition__left{
	background-color:#fff;
	width:200vw;
	height:100vh;
	transform:skewX(-34deg);
	overflow:hidden;
	position:absolute;
	top:0;
	left:-147vw;
	transition:all 0.65s ease-in-out 0.75s;
}

.transition__right{
	background-color:#fff;
	width:200vw;
	height:100vh;
	transform:skewX(-34deg);
	overflow:hidden;
	position:absolute;
	top:0;
	right:-147vw;
	transition:all 0.65s ease-in-out 0.75s;
}

.transition__center{
	position:absolute;
	width:3rem;
	height:100vh;
	transform-origin:50% 50%;
	transform:skewX(-34deg) translatex(-50%);
	background-color:#b9194b;
	content:'';
	top:-100vh;
	left:calc(50% + 67.45vh);
	z-index:9999;
	overflow:hidden;

animation-name: transition__center;
animation-fill-mode:forwards;
animation-duration:1.5s;
animation-iteration-count:1;
animation-timing-function:ease-in-out;
animation-delay: 0.2s;
animation-direction:normal;
}

@keyframes transition__center{
  0% {
    top: -100vh;
	  left:calc(50% + 67.45vh);
  }
  40% {
    top: 0;
  left:50%;
  }
	70%{
    top: 0;
  left:50%;
		opacity:1;
	}
  100% {
    top: 0;
  left:50%;
	opacity:0;
  }
}


body.loaded .transition__left{
	left:-300vw;
}

body.loaded .transition__right{
	right:-300vw;
}



body.home section{
	padding:4.5rem 0;
}

body.home section h2{
	background-repeat:no-repeat;
	background-size:auto 100%;
	height:20vw;
	max-height:250px;
	display:flex;
	flex-direction:column;
	justify-content:center;
}


body.home section h2 span img {
	height:50px;
	width:auto;
	display:block;
	margin:0 0 0.75rem;
}



body.home section h2{
	margin:0 0 1rem;
	color:#b9194b;
}

/* ----------------------------------------
* Home - Hero
* ---------------------------------------- */

section#home__hero{
	height:100vh;
	position:relative;
	padding:0;
}

section#home__hero:after{
	position:absolute;
	width:3rem;
	height:100vh;
	transform-origin:50% 50%;
	transform:skewX(-34deg) translatex(-50%);
	background-color:#b9194b;
	content:'';
	top:0;
	left:50%;
}


section#home__hero .home__hero-top{
	position:relative;
	width:100%;
	height:60vh;

}

section#home__hero .home__hero-top:before{
    position   : absolute;
    content    : "";
    top     : 0px;
    left      : 0px;
    height     : 60vh;
    width      : 100vw;
    background :#fff;
    clip-path  : polygon(0% 0%, calc(50vw + 33.625vh) 0%, calc(50vw - 6.845vh) 100%, 0% 100%);
}

section#home__hero .home__hero-top:after{
    position: absolute;
	display:block;
    content: "";
    top: 0px;
	right:0px;
	width:calc(50vw  + 6.845vh) ;
	height:60vh;
	background-image:url(images/home/hero__top-bg.jpg);
	background-position:50% 50%;
	background-size:cover;
	background-repeat:no-repeat;
	z-index:-1;
}

section#home__hero .home__hero-top .container{
	position:relative;
	z-index:1;
	display:flex;
	flex-direction:column;
	justify-content:flex-start;
	height:100%;
}

section#home__hero .home__hero-bottom{
	height:40vh;
	position:relative;
	width:100%;
}

section#home__hero .home__hero-bottom:before{
    position   : absolute;
    content    : "";
    top     : 0px;
    right      : 0px;
    height     : 40vh;
    width      : 100vw;
    background :#fff;
    clip-path  : polygon(100% 0%, calc(50vw - 6.845vh) 0%, calc(50vw - 33.625vh) 100%, 100% 100%);
}

section#home__hero .home__hero-bottom:after{
    position: absolute;
	display:block;
    content: "";
    top: 0px;
	left:0px;
	width:calc(50vw  - 6.845vh) ;
	height:40vh;
	background-image:url(images/home/hero__bottom-bg.jpg);
	background-position:50% 50%;
	background-size:cover;
	background-repeat:no-repeat;
	z-index:-1;
}
section#home__hero .home__hero-bottom .container{
	position:relative;
	z-index:1;

	height:100%;
}



.hero__description{
	font-size:1.15rem;
	font-weight:bold;
	letter-spacing:0.075em;
	line-height:1.8;
}


.hero__button{
	display:flex;
	align-items:flex-start;
	background-color:#b9194b;
	padding:1rem;
	border-radius:0.75rem;
	color:#fff;
	font-weight:bold;
	letter-spacing:0.05em;
	font-size:1.25rem;
	box-shadow:2px 2px 0px rgba(0,0,0,0.3);
	position:relative;
	transition:all 0.3s ease;

}

.hero__button:before{
	font-family:'Material Symbols Outlined';
	content:'\e5c8';
	display:inline-block;
	font-weight:100!important;
	color:#b9194b;
	background-color:#fff;
	border-radius:100vh;
	width:1.5rem;
	height:1.5rem;
	font-size:1.5rem!important;
	display:flex;
	align-items:center;
	justify-content:center;
	margin-right:0.5rem;
	transition:all 0.3s ease;
}

.hero__button:hover:before{
	color:rgba(185,25,75,1);
	background-color:rgba(255,255,255,01)

}
.hero__button:hover{
	background-color:rgba(185,25,75,0.7);
}


section#hero .material-symbols-outlined {
  font-variation-settings:
  'FILL' 0,
  'wght' 100,
  'GRAD' 0,
  'opsz' 24
}



.hero__copy {
	color:#b9194b;
	font-size:3.25rem;
	font-weight:bold;
	letter-spacing:0.075em;
	line-height:1.7;
	margin:auto 0;
}

a.scroll-down{
  display: inline-block;
  position: absolute;
  right: 40px;
  bottom: 0;
  z-index: 2;
  padding: 10px 10px 110px;
  overflow: hidden;
	color:#b9194b;
  font-size: 0.75rem;
  font-family: 'Inter', sans-serif;
  line-height: 1;
  letter-spacing: .075em;
  text-transform: uppercase;
  text-decoration: none;
  writing-mode: vertical-lr;
	transition:all 0.3s ease;
}

a.scroll-down:hover{
	color:rgba(185,25,75,0.4);
}

a.scroll-down::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 1px;
  height: 100px;
  background: #b9194b;
  animation: sdl 1.5s cubic-bezier(1, 0, 0, 1) infinite;
}
@keyframes sdl {
  0% {
    transform: scale(1, 0);
    transform-origin: 0 0;
  }
  50% {
    transform: scale(1, 1);
    transform-origin: 0 0;
  }
  50.1% {
    transform: scale(1, 1);
    transform-origin: 0 100%;
  }
  100% {
    transform: scale(1, 0);
    transform-origin: 0 100%;
  }
}

@media screen and (max-width: 992px) {
	a.scroll-down{
		display:none;
		}
}

/* ----------------------------------------
* Home - Service
* ---------------------------------------- */

section#home__service{
	position:relative;
}


section#home__service:before{
/*	width:10rem;
	height:90rem;
	background-image:url(images/home/corporate-name.svg);
	background-repeat:no-repeat;
	background-position:100% 100%;
	background-size:contain;
	position:absolute;
	right:0;
	top:calc(100% - 4rem);
	transform:translate(0, -100%);*/
}

section#home__service h2{
/*	background-image:url(images/home/section__graphic-service.svg);
	background-position:50% 50%;*/
}



section#home__service .container{
	position:relative;
}


section#home__service .container:before{
	background-repeat:no-repeat;
	background-size:auto 100%;
	height:220px;
	width:360px;
	display:flex;
	flex-direction:column;
	justify-content:center;
	background-image:url(images/home/section__graphic-service.svg);
	background-position:50% 50%;
	background-size:contain;
	content:'';
	position:absolute;
	left:50%;
	top:0%;
	transform:translate(-50%, 2.5rem);
	opacity:0;
	transition:all 0.45s ease 0.6s;
	z-index:-1;
}

section#home__service.is-show .container:before{
	transform:translate(-50%, 0);
	opacity:1;

}


@media screen and (max-width: 992px) {
section#home__service .container:before{
	display:none;
	}
}

/*
section#home__service .section__graphic{
	content:'';
	width:10rem;
	height:90rem;
	position:absolute;
	right:50%;
	top:0;
	background-image:url(images/home/section__graphic-service.svg);
	background-position:50% 50%;
	background-repeat:no-repeat;
	background-position:100% 100%;
	background-size:contain;
}
*/

section#home__service .content__container{
	display:flex;
	flex-wrap:wrap;
	gap:2rem;
}

section#home__service .content__container .content__item{
	width:calc(33.3333333% - 1.333333333333333rem);
}



section#home__service .content__container .content__item .content__inner{
	background-color:#eeecec;
	border-radius:0.75rem;
	display:flex;
	flex-direction:column;
	height:100%;
	padding:1.5rem;
	transition:all 0.45s ease;
}



section#home__service .content__container .content__item .content__inner .content__image{
	width:40%;
	border-top-left-radius:0.75rem;
	border-bottom-left-radius:0.75rem;
}

section#home__service .content__container .content__item .content__inner .content__image img{
	border-top-left-radius:0.75rem;
	border-bottom-left-radius:0.75rem;
}

section#home__service .content__container .content__item .content__inner .content__text{
	width:60%;
	padding:1.75rem;
}

@media screen and (max-width: 1200px) {
	section#home__service .content__container .content__item{
		width:100%;
	}
	section#home__service .content__container .content__item .content__inner .content__image{
	width:25%;
	}
	section#home__service .content__container .content__item .content__inner .content__text{
	width:75%;
	}
}

section#home__service .content__container.main .content__item .content__inner h3{
	font-size:1.35rem;
	font-weight:bold;
	line-height:1.25;
	margin:0 0 1.25rem;
	background-image:url(images/home/service__icon-01.svg);
	background-repeat:no-repeat;
	background-position:100% 50%;
	height:6.5rem;
	display:flex;
	align-items:center;
}


section#home__service .content__container.main .content__item a:hover .content__inner{
	background-color:rgba(238,236,236,0.5);

	
}


section#home__service .content__container.main .content__item:nth-child(2) .content__inner h3{
	background-image:url(images/home/service__icon-02.svg);
}


section#home__service .content__container.main .content__item:nth-child(3) .content__inner h3{
	background-image:url(images/home/service__icon-03.svg);
}


section#home__service .content__container .content__item .content__inner .content__description{
	font-weight:bold;
	line-height:1.8;
	font-size:0.9rem;
}

section#home__service .content__container.main{
	margin:0 0 3.5rem;
}


section#home__service .content__container.sub .content__item .content__inner{
	background-color:transparent;
	display:flex;
	flex-direction:column;
	height:100%;
	padding:1.5rem;
	transition:all 0.45s ease;
}

section#home__service .content__container.sub .content__item a:hover .content__inner{
	background-color:rgba(238,236,236,0.5);

}

section#home__service .content__container.sub .content__item a{
	display:block;
}

section#home__service .content__container.sub .content__item .content__inner h3{
	font-size:1.35rem;
	font-weight:bold;
	line-height:1.25;
	margin:0 0 0.75rem;
	background-image:url(images/home/service__icon-sub01.svg);
	background-repeat:no-repeat;
	background-position:0% 50%;
	height:6.5rem;
	display:flex;
	align-items:center;
	padding-left:9.5rem;
}


section#home__service .content__container.sub .content__item:nth-child(2) .content__inner h3{
	background-image:url(images/home/service__icon-sub02.svg);
}


section#home__service .content__container.sub .content__item:nth-child(3) .content__inner h3{
	background-image:url(images/home/service__icon-sub03.svg);
}


section#home__service .content__container.sub .content__item:nth-child(4) .content__inner h3{
	background-image:url(images/home/service__icon-sub04.svg);
}


section#home__service .content__container.sub .content__item:nth-child(5) .content__inner h3{
	background-image:url(images/home/service__icon-sub05.svg);
}


section#home__service .content__container.sub .content__item a .content__inner .arrow{
	display:inline-block;
	position:relative;
	height:1rem;
	width:6rem;
	margin-left:auto;
	transition:all 0.45s ease;
}

section#home__service .content__container.sub .content__item a:hover .content__inner .arrow{
	transform:translate(1rem, 0);
}


section#home__service .content__container.sub .content__item .content__inner .arrow:before{
	content:'';
	display:block;
	width:6rem;
	height:1px;
	background-color:#b9194b;
	position:relative;
	transition:all 0.45s ease;
	right:0;
}



section#home__service .content__container.sub .content__item .content__inner .arrow:after{
	content:'';
	display:block;
	width:0.75rem;
	height:1px;
	background-color:#b9194b;
	position:absolute;
	transform-origin:100% 50%;
	transform:rotate(45deg) translatey(0.5px);
	right:0;
	left:auto;
	top:0;
	transition:all 0.45s ease;
}

section#home__service .content__container.sub .content__item a:hover .content__inner .arrow:before{
	width:7rem;
}

section#home__service .content__container.sub .content__item a:hover .content__inner .arrow:after{
	right:-1rem;
}

/* ----------------------------------------
* Home - Achievements
* ---------------------------------------- */

/*
section#home__achievements h2{
	background-image:url(images/home/section__graphic-achievements.svg);
	background-position:100% 50%;
}
*/


section#home__achievements{
	background-color:#eeecec;
}


section#home__achievements .container{
	position:relative;
}


section#home__achievements .container:before{
	background-repeat:no-repeat;
	background-size:auto 100%;
	height:220px;
	width:350px;
	display:flex;
	flex-direction:column;
	justify-content:center;
	background-image:url(images/home/section__graphic-achievements.svg);
	background-position:100% 50%;
	background-size:contain;
	content:'';
	position:absolute;
	right:0;
	top:0%;
	transform:translatey(2.5rem);
	opacity:0;
	transition:all 0.45s ease 0.6s;
}

section#home__achievements.is-show .container:before{
	transform:translatey(0);
	opacity:1;

}

@media screen and (max-width: 992px) {
	section#home__achievements .container:before{
		display:none;
		}
}

section#home__achievements .content__container{
	display:flex;
	flex-wrap:wrap;
	gap:2rem;
}

section#home__achievements .content__container .content__item{
	width:calc(50% - 1rem);
}



section#home__achievements .content__container .content__item .content__inner{
	background-color:#fff;
	border-radius:0.75rem;
	display:flex;
}

section#home__achievements .content__container .content__item .content__inner .content__image{
	width:40%;
	border-top-left-radius:0.75rem;
	border-bottom-left-radius:0.75rem;
}

section#home__achievements .content__container .content__item .content__inner .content__image img{
	border-top-left-radius:0.75rem;
	border-bottom-left-radius:0.75rem;
}

section#home__achievements .content__container .content__item .content__inner .content__text{
	width:60%;
	padding:1.75rem;
}

@media screen and (max-width: 1200px) {
	section#home__achievements .content__container .content__item{
		width:100%;
	}
	section#home__achievements .content__container .content__item .content__inner .content__image{
	width:25%;
	}
	section#home__achievements .content__container .content__item .content__inner .content__text{
	width:75%;
	}
}


section#home__achievements .content__container .content__item .content__inner .content__text h3{
	font-size:1.5rem;
	font-weight:bold;
	color:#b9194b;
	margin:0 0 1.25rem;
}

section#home__achievements .content__container .content__item .content__inner .content__text .content__description{
	font-weight:bold;
	line-height:1.8;
	font-size:0.9rem;
}

section#home__divider {
	width:100vw;
	height:auto;
	aspect-ratio:3840 / 1080;
	background-image:url(images/home/section__divider.jpg);
	background-size:101%;
	background-repeat:no-repeat;
	background-position:50% 505;
	
	
}

/* ----------------------------------------
* Home - Contact
* ---------------------------------------- */

/*
section#home__contact h2{
	background-image:url(images/home/section__graphic-contact.svg);
	background-position:100% 50%;
}
*/

section#home__contact .container{

	position:relative;
}


section#home__contact .container:before{
	background-repeat:no-repeat;
	background-size:auto 100%;
	height:220px;
	width:350px;
	display:flex;
	flex-direction:column;
	justify-content:center;
	background-image:url(images/home/section__graphic-contact.svg);
	background-position:100% 50%;
	background-size:contain;
	content:'';
	position:absolute;
	right:0;
	top:30%;
	transform:translatey(2.5rem);
	opacity:0;
	transition:all 0.45s ease 0.6s;
}

section#home__contact.is-show .container:before{
	transform:translatey(0);
	opacity:1;

}

@media screen and (max-width: 992px) {
	section#home__contact .container:before{
		display:none;
	}
}


section#home__contact .section__description{
	color:#b9194b;
	font-size:1.5rem;
	font-weight:bold;
	line-height:1.5;
	letter-spacing:0.1em;
}

section#home__contact{
	background-color:#eeecec;
}

section#home__contact .content__container{
	display:flex;
	flex-wrap:wrap;
}

section#home__contact .content__container .contact__button-container{
	display:flex;
	align-items:center;
	margin:0 0 0 2rem;
}



section#home__contact .content__container .contact__button{
	display:flex;
	align-items:center;
	background-color:#fff;
	padding:1rem;
	border-radius:0.75rem;
	color:#b9194b;
	font-weight:bold;
	letter-spacing:0.05em;
	font-size:1.25rem;
	box-shadow:2px 2px 0px rgba(0,0,0,0.3);
	position:relative;
	transition:all 0.3s ease;

}

section#home__contact .content__container .contact__button:before{
	font-family:'Material Symbols Outlined';
	content:'\e5c8';
	display:inline-block;
	font-weight:100!important;
	color:#fff;
	background-color:#b9194b;
	border-radius:100vh;
	width:1.5rem;
	height:1.5rem;
	font-size:1.5rem!important;
	display:flex;
	align-items:center;
	justify-content:center;
	margin-right:0.5rem;
	transition:all 0.3s ease;
	
}

section#home__contact .content__container .material-symbols-outlined {
  font-variation-settings:
  'FILL' 0,
  'wght' 100,
  'GRAD' 0,
  'opsz' 24
}

section#home__contact .content__container  .contact__button:hover:before{
	background-color:rgba(185,25,75,0.7);
}
section#home__contact .content__container  .contact__button:hover{
	color:rgba(185,25,75,0.7);
	background-color:rgba(255,255,255,0.6)
}



@media screen and (max-width: 992px) {
section#home__contact .section__description,
section#home__contact .contact__button-container{
	width:100%;
	}
	section#home__contact .content__container .contact__button-container{
		text-align:center;
		padding:1rem 0;
		margin:0;
		justify-content:center;
		align-items:center;
	}
}

/* ----------------------------------------
* Home - News
* ---------------------------------------- */

.news__button-container{
	text-align:right;
}
.news__button{
	width:12rem;
	display:flex;
	align-items:center;
	justify-content:center;
	background-color:#b9194b;
	padding:1rem;
	border-radius:0.75rem;
	color:#fff;
	font-weight:bold;
	letter-spacing:0.05em;
	font-size:1.25rem;
	box-shadow:2px 2px 0px rgba(0,0,0,0.3);
	position:relative;
	margin-left:auto;
	transition:all 0.3s ease;

}

.news__button:before{
	font-family:'Material Symbols Outlined';
	content:'\e5c8';
	display:inline-block;
	font-weight:100!important;
	color:#b9194b;
	background-color:#fff;
	border-radius:100vh;
	width:1.5rem;
	height:1.5rem;
	font-size:1.5rem!important;
	display:flex;
	align-items:center;
	justify-content:center;
	margin-right:0.5rem;
	transition:all 0.3s ease;
}

section#news .material-symbols-outlined {
  font-variation-settings:
  'FILL' 0,
  'wght' 100,
  'GRAD' 0,
  'opsz' 24
}

.news__button:hover:before{
	color:rgba(185,25,75,1);
	background-color:rgba(255,255,255,01)

}
.news__button:hover{
	background-color:rgba(185,25,75,0.7);
}

ul.latest-posts{
	margin:0 0 3.5rem;
}

ul.latest-posts li{
	border-bottom:1px solid #646464;
}

ul.latest-posts li:first-child{
	border-top:1px solid #646464;
}

ul.latest-posts li a{
	padding:2.25rem 3rem 2.25rem 1rem;
	display:block;
	font-weight:bold;
	position:relative;
	line-height:1.6;
}

ul.latest-posts li a .post-date{
	display:inline-block;
	width:8rem;
}

ul.latest-posts li a .post-category{
	color:#b9194b;
	border:1px solid #b9194b;
	border-radius:0.35rem;
	padding:0.25rem;
	width:10rem;
	text-align:center;
	margin:0 2rem 0 0 ;
	display:inline-block;
	line-height:1;
}

ul.latest-posts li a:after{
	position:absolute;
	right:0;
	top:50%;
	transform:translate(0,-50%);
	font-family:'Material Symbols Outlined';
	content:'\e5c8';
	display:block;
	font-weight:100!important;
	color:#b9194b;
	border:1px solid #b9194b;
	border-radius:100vh;
	width:2.0rem;
	height:2.0rem;
	font-size:1.75rem!important;
	display:flex;
	align-items:center;
	justify-content:center;
	margin-right:0.5rem;	
	transition:all 0.45s ease;
}

ul.latest-posts li a:hover:after{
	color:rgba(185,25,75,0.35);
	border-color:rgba(185,25,75,0.35);
}

@media screen and (max-width: 992px) {
	ul.latest-posts li .post-title{
		display:block;
		margin:0.75rem 0 0 0;
	}
}

/* _________________________________________
 * Single Page
 * ________________________________________ */

.pageheader{
	padding:4.25rem 0;
	background-color:#b9194b;
	color:#fff;
}

@media screen and (max-width: 992px) {
.pageheader{
	padding:1.25rem 0;
	}
}

.pageheader .category__title{
	font-size:2.5rem;
	font-weight:bold;
	color:#fff;
	margin:0 0 3.5rem;
}

.pageheader__nav .nav__item a{
	color:#fff;
	display:flex;
	align-items:center;
	justify-content:center;
	padding:0.25rem 1rem;
	border:1px solid #fff;
	border-radius:0.15rem;
	text-align:center;
	transition:all 0.3s ease;
	height:100%;
	
}

.pageheader__nav .nav__item a:hover,
.pageheader__nav .nav__item a.current{
	background-color:#fff;
	color:#b9194b;
	
}

.page__title{
	color:#b9194b;
	font-weight:bold;
	font-size:2rem;
	margin:0 0 3.5rem;
}

/* ________________________________________
 * Shop info
 * ________________________________________ */

div.shop{
	position:relative;
}

a.shop__link{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
}

div.shop .shop__thumb{
	margin:0 0 1rem;
}

div.shop .shop__header{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	margin:0 0 1rem;
}

div.shop .shop__name{
	font-weight:normal;
	color:#000;
}

div.shop .shop__name .en{
	font-size:1.25rem;
	letter-spacing:0.05em;
}
div.shop .shop__name .divider{
	font-size:1.1rem;
}

div.shop .shop__name .jp{
	font-size:0.85rem;
}

div.shop .shop__tel{
	font-size:1.1rem;
	letter-spacing:0.05em;
	margin:0 0 1rem;
}

div.shop .shop__address--en{
	letter-spacing:0.05em;
	font-size:0.9em;
	margin:0 0 0.5rem;
}

div.shop .shop__address--jp{
	font-size:0.9em;
	margin:0 0 1.5rem
}

div.shop .shop__googlemaps{
	margin-left:auto;
}
div.shop .shop__googlemaps > a{
	position:relative;
	display:flex;
	align-items:center;
	
}

div.shop .shop__googlemaps > a:before{
	position:absolutel;
	content:'';
	display:inline-block;
	width:20px;
	height:20px;
	background-image:url(images/common/icon-marker.svg);
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:contain;
	left:0;
}

/* ________________________________________
 * Shop info Single page
 * ________________________________________ */

.shop__menu a{
	background-color:rgba(146,24,30,1);
	color:#fff;
	text-align:center;
	display:block;
	border-radius:100vh;
	padding:0.5rem 1rem;
	letter-spacing:0.1em;
}

dl.shop__concept dt {
	text-align:center;
}

dl.shop__concept dt span {
  background:  rgba(255,255,255,1);
  cursor: pointer;
  font-size: 1em;
	letter-spacing:0.1em;
  padding: 0.5rem 3rem;
  position: relative;
	transition:all 0.3s ease;
display:inline-block;
	margin:0 auto;
	border-radius:100vh;
	font-weight:normal;
}


dl.shop__concept dt span:after {
	position: absolute;
	display:inline-block;
	content: '';
	width:11px;
	height:1px;
	background-color:#000;
	top: 50%;
	right: 11px;
	transition:all 0.3s ease;
}



dl.shop__concept dt span:before {
	position: absolute;
	display:inline-block;
	content: '';
	width:11px;
	height:1px;
	background-color:#000;
	top: 50%;
	right: 11px;
	transform:rotate(90deg);
	transform-origin:50% 50%;
	transition:all 0.3s ease;
}



dl.shop__concept dt span.open:after {
	opacity:0;
}

dl.shop__concept dt span.open:before {
	transform:rotate(360deg);
}


dl.shop__concept dt.open:before,
dl.shop__concept dt:hover:before,
dl.shop__concept dt:hover:after{
	background-color:transparent;
}

dl.shop__concept dd {
  display: none;
  padding: 0;
	margin:0;
	position:relative;
}

.shop__concept--en,
.shop__concept--jp{
	line-height:1.6;
}

.detail{
	line-height:1.4;
}

.detail__name{
	margin:0 0 2.25rem;
}

.detail__name--en{
	font-size:2.25rem;
	margin:0 0 0.25rem;
	letter-spacing:0.05em;
}

.detail__name--jp{
	font-size:1rem;
}

.detail__tel{
	font-size:1.1rem;
	margin:0 0 2.25rem;
}

.detail__address{
	margin:0 0 2.25rem;
}


.detail__address--en{
	margin:0 0 0.25rem;
}


.detail__address--jp{
	
}

.detail__googlemaps{
	margin:0 0 2.25rem;
}

.detail__googlemaps a{
	position:relative;
	display:flex;
	align-items:center;
	
}

.detail__googlemaps a:before{
	position:absolutel;
	content:'';
	display:inline-block;
	width:20px;
	height:20px;
	background-image:url(images/common/icon-marker.svg);
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:contain;
	left:0;
}

.detail__hours{
	margin:0 0 2.25rem;
	line-height:1.4;
}

.detail__credit{
	margin:0 0 2.25rem;
}

.detail__seat{
	margin:0 0 2.25rem;
}

.detail__seat--en{
	margin:0 0 0.25reml
}

.detail__seat--jp{
	
}

.detail__map{
	margin:0 0 1.5rem;
}

.detail__access{
	
}

.detail__access--en{
	margin:0 0 0.75rem;
	line-height:1.4;
}

.detail__access--jp{
	margin:0 0 0.25reml
	line-height:1.3;
}


#accordion{
	
	display:none;
  list-style: none;
  font-size: 16px;
  line-height: 1;
  margin: 0;
  padding: 0;
}
#accordion > li{
  padding: 0;
}
#accordion li a{
  display: block;
  position:relative;
  color: #333;
  text-decoration:none;
  text-shadow: 0 1px 1px rgba(255,255,255,.7);
  padding: 15px 45px;
  border-bottom: 1px solid #79bfd6;
  border-top: 1px solid #eef7fa;
  -moz-transition: .3s;
  -webkit-transition: .3s;
  -o-transition: .3s;
  -ms-transition: .3s;
  transition: .3s;
}
#accordion > li:first-child > a{
  border-top: 0px;
}
#accordion > li a:before {
  position: absolute;
  top: 50%;
  left: 15px;
  font: 24px/100% 'Typicons';
  content: "\0023";
  color: #2f7f99;
  margin-top: -10px;
  text-shadow: 1px 1px 0px rgba(255,255,255,.7);
}
#accordion li a:hover{
  color: #1b4958;
  background: rgba(0,0,0,.1);
  border-top-color: #c7e4ee;
}
.arrow{
  position:absolute;
  top:50%;
  right: 30px;
  width: 30px;
  height: 20px;
  line-height: 1;
  text-shadow: 0 -1px 0px rgba(0,0,0,.3);
  margin-top: -10px;
  color: #d4ebf2;
  -moz-transition: .3s;
  -webkit-transition: .3s;
  -o-transition: .3s;
  -ms-transition: .3s;
  transition: .3s;
}
.arrow:before{
  font: 30px 'Typicons';
  content: "7";
}
#accordion li > a:hover .arrow{
  color: #2f7f99;
}
.rotate {
  color:#2f7f99;
  -moz-transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}
#accordion li ul {
  list-style: none;
  background: #e1f1f6;
  margin: 0;
}
#accordion li ul li a{
  position:relative;
  background: none;
  line-height: 1;
  padding: 15px 70px;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #a0d2e2;
}
#accordion li ul li a:before {
  position: absolute;
  top: 50%;
  left:45px;
  content: "x";
  font:16px/100% 'Typicons';
  color: #2f7f99;
  margin-top: -8px;
  text-shadow: 1px 1px 0 rgba(0,0,0,.5);https://suntoplogi.staging-gig.com/wp-admin/plugins.php
  -moz-transition: .3s;
  -webkit-transition: .3s;
  -o-transition: .3s;
  -ms-transition: .3s;
  transition: .3s;
}
#accordion li ul li:first-child a{
  border-top: 0px;
  box-shadow: 0 7px 7px -7px rgba(0,0,0,.5) inset;
}
#accordion li ul li:last-child a{
  border-bottom: 1px solid #5fb3ce;
}
#accordion li ul li a:hover{
  background: #d4ebf2;
  border-top-color: #eef7fa;
}


/* ------------------------------------------------------------
 * 会社概要
 * ------------------------------------------------------------ */

dl.company__outline{
	
}


dl.company__outline dt{
	padding:0.15rem 0;
	display:inline-block;
	font-weight:bold;
	font-size:1.25rem;
	background: linear-gradient(transparent 60%, rgba(185,25,75,0.1) 60%);
	margin:0 0 0.75rem;
}

dl.company__outline dd{
	margin:0 0 2.25rem;
}


.company__outline-container{
	position:relative;
}

.company__outline-image-01{
	width:550px;
	max-width:45vw;
	position:absolute;
	top:0;
	right:0;
}

.outline__map-container{
	display:flex;
	gap:3rem;
	flex-wrap:wrap;
}

.outline__map-container .flex__item{
	width:calc(50% - 1.5rem);
}

.outline__map-container .flex__item .inner{
	border:8px solid rgba(139,125,126,0.5);
}

@media screen and (max-width: 992px) {
	.company__outline-image-01{
		position:relative;
		width:100%;
		max-width:100%;
	}
	.outline__map-container .flex__item{
		width:100%;
	}

}

/* ------------------------------------------------------------
 * 理念
 * ------------------------------------------------------------ */

section.company__philosophy{
	padding-bottom:4.5rem;
}


section.company__philosophy h3.section__title{
	margin:0 0 1.25rem;
}
section.company__philosophy h3.section__title span{
	display:inline;
	font-weight:bold;
	font-size:1.5rem;
	background: linear-gradient(transparent 60%, rgba(185,25,75,0.1) 60%);

}

.company__philosophy-image-01{
	display:block;
	margin:0 auto 1.5rem auto;
	max-width:100%;
	width:360px;
}


/* ------------------------------------------------------------
 * サステナビリティ
 * ------------------------------------------------------------ */

section.company__sustainability{
	padding-bottom:4.5rem;
}

section.company__sustainability h3.section__title{
	margin:0 0 1.25rem;
}
section.company__sustainability h3.section__title span{
	display:inline;
	font-weight:bold;
	font-size:1.5rem;
	background: linear-gradient(transparent 60%, rgba(185,25,75,0.1) 60%);

}

.company__sustainability-image-01{
	display:block;
	margin:0 auto 2.5rem auto;
	max-width:100%;
	width:600px;
}

.company__sustainability-container{
	display:flex;
	gap:2rem;
	justify-content:center;
	margin:0 0 3rem;
	flex-wrap:wrap;
}

.company__sustainability-container > div{
	width:calc((100% / 6) - (10rem / 6));
}


@media screen and (max-width: 992px) {
.company__sustainability-container{
	gap:1rem;
	}
.company__sustainability-container > div{
	width:calc((100% / 3) - (2rem / 3));
}

}




/* ------------------------------------------------------------
 * サステナビリティ
 * ------------------------------------------------------------ */

section.company__personal-information{
	padding-bottom:4.5rem;
}

section.company__personal-information h3.section__title{
	margin:0 0 1.25rem;
}


section.company__personal-information h3.section__title span{
	display:inline;
	font-weight:bold;
	font-size:1.5rem;
	background: linear-gradient(transparent 60%, rgba(185,25,75,0.1) 60%);

}


section.company__personal-information h4{
	font-weight:bold;
	margin:0 0 0.5rem;
}
section.company__personal-information h5{
	font-weight:bold;
	margin:0 0 0.5rem;
}

section.company__personal-information table{
	width:100%;
	border-collapse:collapse;
	border:1px solid #000;
	margin:0 0 1.75rem;
}

section.company__personal-information table th,
section.company__personal-information table td{
	padding:0.5rem;
	border:1px solid #000;
	vertical-align:middle;
}
section.company__personal-information table th{
	background-color:#d6d6d8;
}



/* ------------------------------------------------------------
 * Q&A
 * ------------------------------------------------------------ */

section.company__qa{
	padding-bottom:4.5rem;
}


section.company__qa h3.section__title{
	margin:0 0 1.25rem;
}

section.company__qa h3.section__title span{
	display:inline;
	font-weight:bold;
	font-size:1.5rem;
	background: linear-gradient(transparent 60%, rgba(185,25,75,0.1) 60%);

}

section.company__qa .nav__container{
	display:flex;
	flex-wrap:wrap;
	gap:1rem;
}

section.company__qa .nav__container .nav__item{
	width:calc(25% - 0.75rem);
}

section.company__qa .nav__container .nav__item a{
	background-color:#a0a0a0;
	padding:0.25rem;
	color:#fff;
	font-weight:bold;
	border-radius:0.25rem;
	display:flex;
	justify-content:center;
	align-items:center;
	height:100%;
	text-align:center;
	min-height:3.5rem;
	transition:all 0.3s ease;
}

section.company__qa .nav__container .nav__item a:hover{
	background-color:#bbb;
}


@media screen and (max-width: 992px) {
	section.company__qa .nav__container{
		gap:0.5rem;
	}
	section.company__qa .nav__container .nav__item{
		width:calc(50% - 0.5rem);
	}
}

.accordion__container {
  margin: 0;
  width: 100%;
}

dl.accordion{
border-bottom:1px solid rgba(90,103,116,0.15);
}

dl.accordion dt {
  background:  rgba(255,255,255,0);
  cursor: pointer;
  padding: 0.75rem 2.5rem 0.75rem 2.5rem;
  position: relative;
	transition:all 0.3s ease;
	counter-increment: question;
	border-top:1px solid rgba(90,103,116,0.15);

}


dl.accordion dt.open,
dl.accordion dt:hover{
	background-color: transparent;
	opacity:0.7s;
  background:  rgba(255,255,255,0.2);
}

dl.accordion dt:before {
  position: absolute;
	display:inline-block;
  content: '';
  top: 0.75rem;
	left: 0.5em;
  background-color: transparent;
  transition: all .3s ease-in-out;
	letter-spacing:0.1em;
	font-weight:normal;
	content: "Q.";

}

dl.accordion dd {counter-increment: answer;
margin-left: 0;

}
dl.accordion dt:after {
  position: absolute;
  top: 0.75rem;
  right: 5px;
  transition: all .3s ease-in-out;
    content: "\e5db";
    font-family: 'Material Symbols Outlined';
	font-size:1.25rem;
	font-weight:200;
	transform:rotate(0deg);
	transform-origin:50% 50%!important;
	border:1px solid #b9194b;
	color:#b9194b;
	border-radius:100vh;
	width:1.5rem;
	height:1.5rem;
	display:flex;
	align-items:center;
	justify-content:center;
	box-sizing:border-box;

}



dl.accordion dt.open:before {
}
dl.accordion dt.open:after {
	transform:rotate(180deg);
}

dl.accordion dt.open:before,
dl.accordion dt:hover:before,
dl.accordion dt:hover:after{
	background-color:transparent;
}

dl.accordion dd {
  display: none;
  padding: 0rem 2.5rem 0.75rem 2.5rem;
  background:  rgba(255,255,255,0.2);
	margin:0;
	position:relative;
	color: #b9194b;
	font-weight:bold;
}

dl.accordion dd:before {
  position: absolute;
	display:inline-block;
  content: '';
  top: 0;
	left: 0.5em;
  background-color: transparent;
  transition: all .3s ease-in-out;
	letter-spacing:0.1em;
	font-weight:normal;
	content: "A.";
	line-height:1;

}




/* ------------------------------------------------------------
 * 採用情報
 * ------------------------------------------------------------ */
section.company__recruit{
		padding-bottom:4.5rem;
}


section.company__recruit h3.section__title{
	margin:0 0 1.25rem;
}

section.company__recruit h3.section__title span{
	display:inline;
	font-weight:bold;
	font-size:1.5rem;
	background: linear-gradient(transparent 60%, rgba(185,25,75,0.1) 60%);

}


section.company__recruit h4{
	font-size:1.5rem;
	background-color:rgba(185,25,75,0.1);
	padding:0.35rem 0.75rem;
	font-weight:bold;
	margin:0 0 1.25rem;
}

section.company__recruit table{
	border-collapse:collapse;
	margin:0 0 2.5rem;
}

section.company__recruit table td,
section.company__recruit table th{
	border:1px solid #000;
	padding:0.75rem;
}

section.company__recruit table th{
	border-left:0px;
	white-space:nowrap;
}

section.company__recruit table td{
	border-right:0px;
}

section.company__recruit table tr:first-child th,
section.company__recruit table tr:first-child td{
	border-top:0px;
}


section.company__recruit table tr:last-child th,
section.company__recruit table tr:last-child td{
	border-bottom:0px;
}


section.company__recruit table dl {
display: flex;
flex-flow: row wrap;
width: 100%;
margin:1.5rem 0 0 0;
}

section.company__recruit table dl dt {
flex-basis: 7em;
padding: 0;
margin:0 0 0.25rem;
font-weight:normal;
}

section.company__recruit table dl dd {
flex-basis: calc(100% - 7em);
padding: 0;
margin:0 0 0.25rem;
}


.recruit__button{
	text-align:center;
}

.recruit__button a{
	font-size:1.5rem;
	padding:1.25rem 1.75rem;
	font-weight:bold;
}


/* ------------------------------------------------------------
 * 私たちの強み
 * ------------------------------------------------------------ */

section.strengths .nav__container{
	position:sticky;
	top:100px;
	background-color:rgba(255,255,255,0.9);
	padding:1rem;
}


section.strengths .nav__container .nav__item a{
	display:block;
	padding:0.75rem 0;
	position:relative;
	color:#b9194b;
}
section.strengths .nav__container .nav__item a:after{
	font-family:'Material Symbols Outlined';
	content:'\e5e1';
	display:inline-block;
	font-weight:100!important;
	display:flex;
	position:absolute;
	right:0;
	top:50%;
	transform:translate(0, -50%);
}

section.strengths{
	padding:0rem 0 3.5rem;
}

section.strengths h3.section__title{
	color:#b9194b;
	font-weight:bold;
	font-size:2rem;
	margin:0 0 2.5rem;
}

section.strengths__achievements table{
	width:100%;
	border-collapse:collapse;
	margin:0 0 3.5rem;
}

section.strengths__achievements table th,
section.strengths__achievements table td{
	padding:0.25rem 0.75rem;
}

section.strengths__achievements table tr:first-child th {
	background-color:#b9194b;
	color:#fff;
	font-weight:bold;
}

section.strengths__achievements table tr:nth-child(even){
	background-color:rgba(185,25,75,0.1);
}

section.strengths__achievements table tr:nth-child(odd){
	background-color:rgba(185,25,75,0.2);
}

section.strengths__achievements table tr th:first-child{
	width:30%;
}

section.strengths__achievements table tr td{
	width:70%;
	border-left:1px solid #000;
}

.testimonials__container{
	display:flex;
	margin:0 0 3rem;
}

.testimonials__container .testimonials__icon{
	width:140px;
	text-align:center;
}

.testimonials__container .testimonials__icon img{
	display: block;
	width:60%;
	margin:0 auto;
}

.testimonials__container .testimonials__balloon{
	width:calc(	100% - 140px);
}

.testimonials__balloon .inner{
  position: relative;
  display: inline-block;
  padding:1rem;
  min-width: 120px;
  max-width: 100%;
  color: #555;
  font-size: 16px;
  background-color: #e0edff;
	border-radius:0.5rem;
}

.testimonials__balloon .inner:before {
  content: "";
  position: absolute;
  top: 2.5rem;
  left: -24px;
  margin-top: -12px;
  border: 12px solid transparent;
  border-right: 12px solid #e0edff;
}

.lead-copy{
	font-size:1.15rem;
	font-weight:bold;
	margin:0 0 0.25rem;
}

.testimonials__container01 .testimonials__balloon .inner{
	background-color:rgba(164,224,156,0.15);
}
.testimonials__container01 .testimonials__balloon .inner:before{
	border-right-color:rgba(164,224,156,0.15);
}

.testimonials__container02 .testimonials__balloon .inner{
	background-color:rgba(238,197,106,0.15);
}
.testimonials__container02 .testimonials__balloon .inner:before{
	border-right-color:rgba(238,197,106,0.15);
}

.testimonials__container03 .testimonials__balloon .inner{
	background-color:rgba(238,156,165,0.15);
}
.testimonials__container03 .testimonials__balloon .inner:before{
	border-right-color:rgba(238,156,165,0.15);;
}

.testimonials__container04 .testimonials__balloon .inner{
	background-color:rgba(108,176,205,0.15);
}
.testimonials__container04 .testimonials__balloon .inner:before{
	border-right-color:rgba(108,176,205,0.15);
}



/* ------------------------------
 * ライセンス取得
* ------------------------------ */

section.strengths__licensing h4{
	margin:0 0 1.25rem;
}
section.strengths__licensing h4 span{
	display:inline;
	font-weight:bold;
	font-size:1.5rem;
	background: linear-gradient(transparent 60%, rgba(185,25,75,0.1) 60%);
}

.licensing__container{
	margin:0 0 3rem;
}

.licensing__container .inner{
	background-color:rgba(185,25,75,0.1);
	border-radius:0.75rem;
	padding:1rem;
}

.licensing__flex-container{
	display:flex;
	gap:2rem;
	flex-wrap:wrap;
}

.licensing__container h5{
	font-size:1.25rem;
	font-weight:bold;
	border-bottom:1px solid #000;
	margin:0 0 0.35rem;
	padding: 0 0 0.35rem;
}

.licensing__flex-container .licensing__image{
flex-basis: 100px;
	
}

.licensing__flex-container .licensing__text{
	flex-basis: calc(100% - 100px - 2rem);
}

.licensing__flex-container .licensing__text.noimage{
	flex-basis:100%;
}

@media screen and (max-width: 992px) {
	.licensing__flex-container .licensing__image{
		flex-basis: 100%;
	}
	
		.licensing__flex-container .licensing__image img{
			max-width:50%;
			margin:0 auto;
			display:block;
	}
	.licensing__flex-container .licensing__text{
		flex-basis: 100%;
	}

}

/* ------------------------------
 * 拠点・立地
* ------------------------------ */

.strengths__locations.full-width{
	width:100vw;
	margin-left:calc(50% - 50vw - 16.666666666%);
	margin-right:calc(50% - 50vw);
}



.strengths__locations.bg-darkgrey a{
	color:#fff;
}


.locations__container{
	display:flex;
	gap:2rem;
	flex-wrap:wrap;
	border-bottom:1px solid #000;
	padding: 3rem 0 3rem;
}

.locations__container.main,
.locations__container.comment,
.locations__container.suntop{
	border:0px;
}

.locations__container.last{
	border-bottom:0px;
	margin:0;
}

.locations__text{
	width:40%;
	display:flex;
	flex-direction:column;
	justify-content:space-between
}

.locations__text h4 span{
	display:inline-block;
	font-weight:bold;
	font-size:1.5rem;
	background: linear-gradient(transparent 60%, rgba(185,25,75,0.1) 60%);
	margin:0 0 1.25rem;
}

.locations__text dl dt{
	margin:0 0 0.5rem;
}

.locations__text dl dt span{
	background-color:#fff;
	color:#b9194b;
	padding:0.25rem;
	font-size:0.85rem;
	width:5rem;
	text-align:center;
	display:inline-block;
}

.locations__text dl dt a{
	border-radius:100vh;
	padding:0.1rem 1rem;
	font-size:0.7rem;
	display:inline-block;
	margin:0 0 0 1rem;
}

.locations__text dl dd{
	margin:0 0 1rem;
}
	

.locations__image{
	width:calc(60% - 2rem);
}

#section03 .locations__text h4 span{
	background:none;
}

#section03 .locations__container{
	border-bottom:0px;
	margin:0;
}




.locations__container.main,
.locations__container.comment{
	display:flex;
	margin:0!important;
}

.locations__container.comment .locations__icon{
	width:140px;
	text-align:center;
}

.locations__container.comment .locations__icon img{
	display: block;
	width:80%;
	margin:0 auto;
}

.locations__container .locations__balloon{
	width:calc(	100% - 140px - 2rem);
}

.locations__balloon .inner{
  position: relative;
  display: inline-block;
  padding:1rem;
  min-width: 120px;
  max-width: 100%;
  color: #555;
  font-size: 16px;
  background-color: #fff;
	border-radius:0.5rem;
}

.locations__balloon .inner:before {
  content: "";
  position: absolute;
  top: 2.5rem;
  left: -24px;
  margin-top: -12px;
  border: 12px solid transparent;
  border-right: 12px solid #fff;
}

@media screen and (max-width: 992px) {
	.strengths__locations.full-width{
		margin-left:calc(50% - 50vw - 0%);
	}
	.locations__text{
		width:100%;
	}
	.locations__image{
		width:100%;
	}

	.locations__container.comment .locations__icon{
		width:100px;
	}

	.locations__container .locations__balloon{
		width:calc(	100% - 100px - 2rem);
	}


}



/* ------------------------------
 * 選ばれ続ける4つの理由
* ------------------------------ */

.strengths__reasons.full-width{
	width:100vw;
	margin-left:calc(50% - 50vw - 16.666666666%);
	margin-right:calc(50% - 50vw);
}

.strengths__reasons h4{
	margin:0 0 1.25rem;
}

.strengths__reasons h4 span{
	display:inline;
	font-weight:bold;
	font-size:1.5rem;
	background: linear-gradient(transparent 60%, rgba(185,25,75,0.1) 60%);
}

@media screen and (max-width: 992px) {
	.strengths__reasons.full-width{
		margin-left:calc(50% - 50vw - 0%);
	}
}


/* ------------------------------------------------------------
 * サービス
 * ------------------------------------------------------------ */
.service__title{
	font-size:3.25rem;
	font-weight:bold;
	position:relative;
	line-height:1.3;
	background-repeat:no-repeat;
	background-position:100% 0%;
	background-size:contain;
	height:14rem;
}

section.service{
	padding:1.5rem 0 3.5rem 0;
}


section.service h4{
	margin:0 0 1.25rem;
}
section.service h4 span{
	display:inline;
	font-weight:bold;
	font-size:1.5rem;
	background: linear-gradient(transparent 60%, rgba(185,25,75,0.1) 60%);

}



@media screen and (max-width: 992px) {
	.service__title{
		font-size:1.75rem;
		height:7.5rem;
		display:flex;
		align-items:center;
		background-size:auto 50%;
		background-position:100% 50%;
	}
}


.service__title#cosmetics{
	background-image:url(images/service/cosmetics/title__icon.svg);
}

.service__title#logistics-processing{
	background-image:url(images/service/logistics-processing/title__icon.svg);
}


.service__title#ec-logistics-agency{
	background-image:url(images/service/ec-logistics-agency/title__icon.svg);
}

.service__title#shrink-wrapping{
	background-image:url(images/service/shrink-wrapping/title__icon.svg);
}

.service__title#label-barcode-serial-number{
	background-image:url(images/service/label-barcode-serial-number/title__icon.svg);
}

.service__title#lot-management{
	background-image:url(images/service/lot-management/title__icon.svg);
}

.service__title#inspection{
	background-image:url(images/service/inspection/title__icon.svg);
}



.service__title#campaign-office{
	background-image:url(images/service/campaign-office/title__icon.svg);
}



section.service .nav__container{
	position:sticky;
	top:100px;
	background-color:rgba(255,255,255,0.9);
	padding:1rem;
}


section.service .nav__container .nav__item a{
	display:block;
	padding:0.75rem 0;
	position:relative;
	color:#b9194b;
}
section.service .nav__container .nav__item a:after{
	font-family:'Material Symbols Outlined';
	content:'\e5e1';
	display:inline-block;
	font-weight:100!important;
	display:flex;
	position:absolute;
	right:0;
	top:50%;
	transform:translate(0, -50%);
}

section.service{
	padding-bottom:4.5rem;
}


section.service h3.section__title{
	color:#b9194b;
	font-weight:bold;
	font-size:1.5rem;
	margin:0 0 3.5rem;
}


.service__container{
	margin:0 0 2.5rem;
	background-color:rgba(139,125,126,0.15);
	padding:1.75rem;
	border-radius:0.75rem;
}

.service__container .service__flex-container{
	display:flex;
	gap:2rem;
	flex-wrap:wrap;
}

.service__container .service__flex-container .service__text{
	width:calc(70% - 2rem);
}

.service__container .service__flex-container .service__image{
	width:30%;
}

.service__container .service__flex-container .service__image img{
	border-radius:0.5rem;
}

.service__container .service__flex-container .service__text h4{
	margin:0 0 1.25rem;
}

.service__container .service__flex-container .service__text h4 span{
	display:inline;
	font-weight:bold;
	font-size:1.25rem;
	background: linear-gradient(transparent 60%, rgba(185,25,75,0.1) 60%);
}



@media screen and (max-width: 992px) {
	.service__container .service__flex-container .service__text{
		width:100%;
		order:1;
	}

	.service__container .service__flex-container .service__image{
		width:100%;
		order:0;
	}

}


/* ------------------------------
 * 流通加工サービス
 * ------------------------------ */

.logistics-processing__button{
	text-align:center;
}

.logistics-processing__button a{
	font-weight:bold;
	padding:0.75rem 2rem;
}

/* ------------------------------
 * EC物流代行サービス
 * ------------------------------ */

ec-logistics-agency



.service__campaign-office table{
	width:100%;
	border-collapse:collapse;
	border:1px solid #000;
	
}
.service__campaign-office table th,
.service__campaign-office table td{
	border:1px solid #000;
	padding:0.5rem;
	text-align:center;
	vertical-align:middle;
}

.service__campaign-office table tr td:first-child{
	white-space:nowrap;
}

.service__campaign-office table tr td:last-child{
	text-align:left;
}


.service__campaign-office table th{
background-color:#f5f5f5;
}


/* ------------------------------------------------------------
 * お知らせ
 * ------------------------------------------------------------ */

.btn__news-back{
	font-size:1.25rem;
	padding:0.75rem 2rem 0.75rem 4rem;
	border-radius:0.5rem;
	box-shadow:2px 2px 0px #999;
}

.btn__news-back:before{
	font-family:'Material Symbols Outlined';
	content:'\e5c4';
	display:inline-block;
	font-weight:100!important;
	font-size:1.5rem!important;
	display:flex;
	left:1rem;
	align-items:center;
	justify-content:center;
	margin-right:0.25rem;	
	transition:all 0.3s ease;
	transform-origin:50% 50%;	
	position:absolute;
	background-color:#fff;
	border-radius:100vh;
	width:2.0rem;
	height:2.0rem;
}

/* ------------------------------------------------------------
 * Contact
 * ------------------------------------------------------------ */

table.inquiry input,
table.inquiry textarea{
	border:1px solid #ddd;
}
table.inquiry th,table.inquiry td {
   padding:0.5rem!important;
}

/* Contact Form7スマホ・タブレット用カスタマイズ */
@media(max-width:768px){
/* テーブルの見出しとフォーム */
table.inquiry th,table.inquiry td {
   display:block;
   padding:1em 1em!important;
   width:100%;
   border:0;
}

/* 送信ボタン */
input.wpcf7-submit{
   margin-bottom:30px;
   width:100%;
}
}

/* 日付タグ上のテキストをPCとスマホで変更 */
@media(max-width:900px){
.pcdate{
   display: none;
}
}
@media(min-width:1000px){
.spdate{
   display: none;
}
/* 日付タグの幅を調整 */
.wpcf7-date.dateform{
   width: 25%;
}
}

/* Contact Form7全体カスタマイズ */

/* 自動入力されるPタグを無効にする */
.inquiry p {
   display: inline;
}

/*テーブル下に余白.枠線・テキストの行間 */
table.inquiry {
   margin-bottom: 30px;
   border:solid 1px #d7d7d7;
   line-height:1.2;
   vertical-align:middle;
	width:100%;
}

/* テーブルの行 */
.inquiry tr {
   border:0!important;
}

/* テーブルの見出し側 */
.inquiry th{
   text-align:left;
   font-size:14px;
   color:#444;
   padding:1em 0.5em;
   width:0;
   background:#efefef;
   border:solid 1px #d7d7d7;
   white-space: nowrap;
   vertical-align: middle;
}

/* 必須と任意タグ */
.haveto,.any{
   font-size:13px;
   padding:5px;
   background:#b9194b;
   color:#fff;
   border-radius:2px;
   margin-right:5px;
   font-weight:normal;
}

/* 任意タグの背景カラー */
.any{
   background:#999;
}

/* テーブルフォーム側 */
.inquiry td{
   font-size:13px;
   border:solid 1px #d7d7d7;	
}

/* 入力エリア幅最大 */
.wpcf7-form-control {
   width: 100%;
}

/* フォーム入力欄の余白・背景カラー・枠線消す指定 */
.inquiry input,.inquiry select,.inquiry textarea {
   background:#eff1f5;
   border: none;
   padding:0.7em;
}
.inquiry textarea {
   padding-bottom:10em;
}

/* チェックボックスとラジオボタンの位置調整 */
.wpcf7-list-item-label,.wpcf7-checkbox,input[type=checkbox],input[type=radio]{
   vertical-align:middle;
}
.wpcf7-list-item-label{
   padding:0 5px 0 2px;
}
/*ラジオボタンを縦並び指定*/
.verticallist{
   display:inline-grid;
}

/* 送信ボタンのデザイン */
.wpcf7-submit{
   display: block;
   margin:10px auto;
   padding:0.75rem 2rem;
   background:#b9194b;
	text-align:center;
   color:#fff;
   font-size:18px;
   font-weight:bold;	 
   border-radius:4px;
   border: none;
	width:auto;
}

/* 送信ボタンマウスホバー時 */
.wpcf7-submit:hover{
   opacity: 0.9;
   transition: 0.3s;
}

/* フォーム上部に表示されるエラーメッセージを非表示 */
.screen-reader-response {
    display: none;
}

/* フォーム内エラーメッセージを赤色に指定 */
.wpcf7-not-valid-tip {
    color: #e92323;
}

/* ------------------------------------------------------------
 * 物流用語集
 * ------------------------------------------------------------ */
#epkb-ml__module-search{
	background-color:transparent!important;
}

.eckb-kb-block-search #epkb-ml__module-search #epkb-ml-search-classic-layout .epkb-ml-search-title{
	color:#b9194b!important;
	font-size:2.5rem!important;
	margin:2.5rem 0;
}

input.epkb-ml-search-box__input{
	background-color:#f5f5f5!important;
	border:1px solid #777!important;
}

#epkb-ml__module-search #epkb-ml-search-classic-layout .epkb-ml-search-box__btn{
	background-color:#b9194b!important;
}

.epkb-ml__module-categories-articles__row section.epkb-top-category-box{
	border:1px solid #b9194b!important;
	border-radius:0.75rem!important;
	height:100%!important;
	min-height:auto!important;
}

.epkb-ml__module-categories-articles__row > section .section-head{
	border-top-right-radius:0.75rem!important;
	border-top-left-radius:0.75rem!important;
	background-color:#b9194b!important;
	color:#fff!important;
	border-bottom:0px!important;
}

#epkb-ml__module-categories-articles #epkb-ml-categories-layout .section-head .epkb-category-level-1 .epkb-cat-name .epkb-cat-name-count-container .epkb-cat-name{
	color:#fff!important;
}

.ep_font_icon_folder:before{
	content:''!important;
}

.epkb-cat-icon{
	display:none!important;
}

.epkb-category-level-1{
	justify-content:space-between!important;
}

.epkb-cat-name{
	width:100%;
}

.epkb-cat-name .epkb-cat-name-count-container{
	display:flex;
	justify-content:space-between;
}

.epkb-cat-count{
	background-color:transparent!important;
	color:#fff!important;
	border:0px!important;
}


#eckb-article-page-container-v2 #eckb-article-body #eckb-article-content #eckb-article-content-header-v2 #eckb-article-content-title-container .eckb-article-title{
	color:#b9194b;
	font-weight:bold;
	font-size:2.0rem;
	margin:1rem 0 2.5rem!important;
}

.epkb-ml-search-title{
	color:#b9194b!important;
	font-size:2.5rem!important;
	margin:2.5rem 0!important;
}

#epkb-ml__module-search #epkb-ml-search-classic-layout #epkb-ml-search-form #epkb-ml-search-box{
	box-shadow:none!important;
}

main.eckb-category-archive-main{
	padding:0!important;
}

.epkb-article__icon.ep_font_icon_document{
	display:none!important;
}

.eckb-category-archive-main .eckb-category-archive-arrow.epkbfa.epkbfa-arrow-right:before{
content:''!important;
}

.eckb-article-title__icon.ep_font_icon_document{
	display:none!important;
}

.epkb-sidebar__heading__inner__cat-name{
	color:#b9194b!important;
}

.epkb_sidebar_expand_category_icon.ep_font_icon_arrow_carrot_right{
	display:none!important;
}

.eckb-acll__title{
	display:none!important;
}