@charset "UTF-8";

/*----------------------------------------------------
	Default
----------------------------------------------------*/

html {
	-webkit-text-size-adjust:none;
	overflow-y: scroll;
	position: relative;
	height: 100%;
	scroll-behavior: smooth;
}

body {
	position: relative;
	height: 100%;
}

address,caption,cite,code,dfn,em,strong,th,var {
	font-style: normal;
}

h1, h2, h3, h4, h5, h6{
	font-size: 100%;
	font-weight: normal;
	margin: 0;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

caption,th {
	text-align: left;
}

q {
	font-style: normal;
}

q:before{
	content: no-open-quote;
}

q:after {
	content: no-close-quote;
}

object,
embed,
img {
	vertical-align: top;
}

hr,legend {
	display: none;
}

img,abbr,acronym,fieldset {
	border: 0;
}

figure {
	margin: 0;
}

button, input, select, textarea {
	-webkit-appearance: none;
	appearance: none;
	font-family: "hrdo-400", sans-serif;
	font-size : 100%;
	border-radius: 0;
}

input[type="checkbox"],
input[type="radio"] {
	-webkit-appearance: checkbox;
	appearance: auto;
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
	border-radius: 0;
}

/*----------------------------------------------------
	Color
----------------------------------------------------*/

body {
	color: #000;
}

::selection {
	background: #ddd;
}

::-moz-selection {
	background: #ddd;
}

.highlight {
	color: #ff0066;
}

.text-light {
	color: #fff;
}

/*----------------------------------------------------
	Typography
 ----------------------------------------------------*/
 
@font-face {
 font-family: "hrdo-400";
 src: url("../fonts/hrdo_sans_02-400.woff2") format("woff2"), url("../fonts/hrdo_sans_02-400.woff") format("woff");
}

@font-face {
 font-family: "hrdo-700";
 src: url("../fonts/hrdo_sans_02-700.woff2") format("woff2"), url("../fonts/hrdo_sans_02-700.woff") format("woff");
}

body {
	font-family: "hrdo-400", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
	font-size: 15px;
	line-height: 1.75;
}

h2 {
	margin: 0 0 20px 0;
	font-size: 20px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

.en {
	font-size: 105%;
	letter-spacing: 0.05em;
}

.negativeindent {
	display: inline-block;
	text-indent: -0.5em;
}

.endnegativemargin {
	display: inline-block;
	margin-right: -0.5em;
}

.parenthesis {
	font-size: 92%;
}

/*----------------------------------------------------
	Link
 ----------------------------------------------------*/

a {
	opacity: 1;
}

a:link,
a:visited {
	color: inherit;
	text-decoration: none;
}

a:hover,
a:active {
	opacity: 0.3;
}

.text-light a:hover,
.text-light a:active {
	opacity: 0.7;
}

a.btn,
a.btn:link,
a.btn:visited {
	display: inline-block;
	padding: 10px 20px;
	background: #ffd200;
	font-weight: 500;
}

a.btn:hover,
a.btn:active {
	opacity: 1;
	background: #ffb61c;
}

.arrow{
  background: none;
  padding: 0;

  display: inline-flex;        /* 親の text-align で左右に寄せる */
  align-items: center;         /* 基本は中央 */
  gap: .4em;                   /* 矢印と文字の間隔 */
  line-height: 1;              /* 本文の 1.75 の影響を受けないように */
}

/* 矢印（SVG）を前に出す。「ちょい上げ」用の変数を用意 */
.arrow{
  --arrow-nudge: -0.12em;      /* 視覚調整。-0.04〜-0.10em で微調整 */
}

.arrow::before{
  content: "";
  display: inline-block;
  width: 1.5em;               /* 文字サイズに追従 */
  aspect-ratio: 25 / 13;       /* 元画像の縦横比を維持して高さ自動 */
  background: url(../images/common/arrow.svg) no-repeat center / contain;
  transform: translateY(var(--arrow-nudge));  /* わずかに上に持ち上げる */
  flex: 0 0 auto;
}


.dropdown {
	position: relative;
	width: 100%;
	box-sizing: border-box;
	border: 1px solid #ccc;
	background: #fff;
}

.dropdown a:hover {
	opacity: 1;
}

.dropdowntoggle {
	display: block;
	padding: 10px;
	text-decoration: none;
	color: black;
	position: relative;
}

.dropdowntoggle::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 10px;
	width: 12px;
	height: 12px;
	background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 86.6"><polygon points="0,0 100,0 50,86.6" fill="black"/></svg>') no-repeat center center;
	background-size: 80% 80%;
	transform: translateY(-50%);
	pointer-events: none;
}

.dropdownmenu {
	display: none;
	position: absolute;
	top: 100%;
	left: -1px;
	width: 100%;
	border: 1px solid #ccc;
	border-top: none;
	background: #fff;
	list-style: none;
	margin: 0;
	padding: 0;
	z-index: 1000;
}

.dropdownmenu li a {
	display: block;
	padding: 10px;
	text-decoration: none;
}

.dropdownmenu li a:hover {
	background: #f0f0f0;
	opacity: 1;
}

.dropdown.open .dropdownmenu {
	display: block;
}

/*----------------------------------------------------
	Layout
 ----------------------------------------------------*/

.grecaptcha-badge {
	visibility: hidden;
}

.spnone {
	display: none;
}

body {
	position: relative;
	margin: 0;
}

header {
	position: relative;
	width: 100%;
	margin: 0 auto;
}

h1 {
	position: fixed;
	top: 20px;
	left: 15px;
	z-index: 9999;
	height: 26px;
	margin:	0;
	padding: 0;
	line-height: 0.9;
}

h1 img {
	width: 125px;
}

h1 a,
h1 a:link,
h1 a:visited,
h1 a:hover,
h1 a:active {
	background: none;
}

.globalnav {
	position:fixed;
	z-index: -1;
	opacity: 0;
	top:0;
	width:100%;
	height: 100dvh;
	background:rgba(255,210,0,0.95);
	transition: all 0.5s;
}

.globalnav.panelactive {
	opacity: 1;
	top: 0;
	left: 0;
	z-index: 9997;
}

.globalnav ul {
	display: none;
	padding: 0;
	position: absolute;
	z-index: 9998;
	top:47%;
	left:50%;
	transform: translate(-50%,-50%);
}

.globalnav.panelactive ul {
	display: block;
}

.globalnav li{
	margin:  20px 0;
	list-style: none;
	font-size: 20px;
	line-height: 28px;
	letter-spacing: 0.04em;
	text-align: center; 
}

.globalnav li a {
	padding:10px;
}
.openbtn{
	position:fixed;
	z-index: 9999;
	top:23px;
	right: 20px;
	cursor: pointer;
	width: 20px;
	height:15px;
}

.openbtn span {
	display: inline-block;
	transition: all .4s;
	position: absolute;
	left: 0px;
	height: 1px;
	border-radius: 2px;
	background-color: #000;
  	width: 100%;
  }

.openbtn.text-light span {
	background-color: #000;
  }

.openbtn span:nth-of-type(1) {
	top: 0px;	
}

.openbtn span:nth-of-type(2) {
	top:7px;
}

.openbtn span:nth-of-type(3) {
	top:14px;
}

.openbtn.active span:nth-of-type(1) {
	top: 0px;
	left: 0px;
	transform: translateY(6px) rotate(-33deg);
	width: 113%;
}

.openbtn.active span:nth-of-type(2) {
	opacity: 0;
}

.openbtn.active span:nth-of-type(3){
	top: 12px;
	left: px;
	transform: translateY(-6px) rotate(33deg);
	width: 112%;
}

#eyecatch {
	width: 100%;
	height: 160px;
	padding: 100px 0 0 0;
}

#index #eyecatch {
	height: 160px;
}

#eyecatch img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

main {
	position: relative;
	width: 100%;
	margin: 0 auto;
}

main nav.contentnav {
	position:fixed;
	z-index: 9999;
	margin: 15px 0 0 0;
	list-style: none;

}

main nav.contentnav ul {
	width: 100%;
	margin: 0;
	padding: 0;
	text-align: right;
}

main .contentnav ul li {
	display: inline-block;
	margin: 0 0 0 20px;
	padding: 0;
	font-size: 22px;
	line-height: 1;
}

main section {
	margin: 40px 0;
}

main .container {
	display: block;
}

main .col1,
main .col2,
main .col3,
main .col4,
main .col5,
main .col6,
main .col7,
main .col8,
main .col9,
main .col10,
main .col11,
main .col12 {
	width: 100%;
}

footer {
	width: 100%;
	margin: 50px auto 0 auto;
	padding: 20px 0;
	border-top: 1px solid #ccc;
}

footer p,
footer address {
	margin: 0 15px;
	font-size: 13px;
}

footer p.credit {
	margin-top: 1em;
}

/*----------------------------------------------------
	Index
 ----------------------------------------------------*/

#index main #statement {
	margin: 15px;
}


#index main #statement .copy img {
	display: block;
	width: 50%;
	margin: 0 auto;
}

#index main #statement h3 {
	margin-top: 6px;
	font-size: 20px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#index main #statement a.btn {
	display: block;
	margin: 15px auto 0 auto;
	text-align: center;
}

#index main #news h2 {
	margin: 15px;
}

#index main #news ul li {
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid #ccc;
}

#index main #news ul {
	margin: 0;
	padding: 0;
}

#index main #news ul li:last-child {
	border-bottom:1px solid #ccc;
}

#index main #news ul li a,
#index main #news ul li a:link,
#index main #news ul li a:visited {
	padding: 15px;
	background: #fff;
	opacity: 1;
}

#index main #news ul li a:hover,
#index main #news ul li a:active {
	background: #f6f6f6;
}

#index main #news ul li time {
	display: block;
}

#index main #news ul li .category {
	display: block;
}

#index main #news ul li .text {
	display: block;
}

#index main #activities h2 {
	margin: 15px;
}

#index main #activities .container {
	width: calc(100% - 30px);
	padding: 15px;
	background: #f6f6f6;
}

#index main #activities a.item,
#index main #activities a.item:link,
#index main #activities a.item:visited {
	opacity: 1;
	background: #fff;
	border: 1px solid #f6f6f6;
}

#index main #activities a.item:hover,
#index main #activities a.item:active {
	opacity: 1;
	border: 1px solid #ccc;
}

#index main #activities .container .item.container {
	display: flex;
	box-sizing: border-box;
	width: calc(100% - 2px);
	padding: 0;
	gap: 0;
	background: #fff;
}

#index main #activities .container .item.container .image {
	width: 140px;
	aspect-ratio: 1 / 1;
}

#index main #activities .container .item.container .image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

#index main #activities .container .item.container .content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: calc(100% - 120px);
	padding: 10px;
	font-size: 12px;
}

#index main #activities .container .item.container .content h3 {
	margin: 0;
	font-weight: 500;
}

#index main #activities .container .item.container .content p {
	margin: 0;
}

#index main #activities .container .item.container .content .more {
	margin: auto 0 0 0;
	text-align: right;
	line-height: 1;
}

#index main #feature {
	margin: 0 15px;
}

#index main #feature a.item,
#index main #feature a.item:link,
#index main #feature a.item:visited {
	background: #fff;
	opacity: 1;
}

#index main #feature a.item:hover,
#index main #feature a.item:active {
	background: #f0f0f0;
	opacity: 1;
}

#index main #feature .item.container {
	display: flex;
	border: 1px solid #ccc;
	margin-bottom: -1px;
	gap: 0;
}

#index main #feature .item.container .image {
	width: 140px;
	aspect-ratio: 1 / 1;
}

#index main #feature .item.container .image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

#index main #feature .item.container .content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: calc(100% - 120px);
	padding: 10px;
	font-size: 12px;
}

#index main #feature .item.container .content p.sub {
	margin: 0;
	font-size: 12px;
	font-weight: 500;
}

#index main #feature .item.container .content h3 {
	font-size: 12px;
	font-weight: 500;
}

#index main #feature .item.container .content p {
	font-size: 12px;
	font-weight: 500;
}

/*----------------------------------------------------
	About
 ----------------------------------------------------*/

#about h2 {
	margin: 15px;
}

#about main #statement {
	width: auto;
	margin: 30px 15px 15px 15px;
}

#about main #statement .copy img {
	display: block;
	width: 50%;
	margin: 0 auto;
}

#about main #statement h3 {
	margin: 30px 0 0 0;
	font-size: 20px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#about main #greeting {
	width: auto;
	margin: 30px 15px 15px 15px;
}

#about main #greeting h3 {
	margin: 15px 0 0 0;
	text-align: center;
	font-size: 20px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#about main #greeting .container .photo {
	width: 60%;
	margin: 0 auto;
}

#about main #greeting .container .photo img {
	width: 100%;
	margin: 20px 0 0 0;
}

#about main #greeting .copy img {
	display: block;
	width: 310px;
	margin: 0 auto;
}

#about main #mvv {
	margin: 30px 0 15px 0;
}

#about main #mvv h3 {
	margin: 15px 0;
	text-align: center;
	font-size: 20px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#about main #mvv #mission {
	background: #FFD200;
	padding: 15px;
}

#about main #mvv #vision {
	background: #FFB61C;
	padding: 15px;
}

#about main #mvv #value {
	background: #FF9B37;
	padding: 15px;
}

#about main #mvv h4 {
	text-align: center;
	font-size: 20px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#about main #mvv .col7 {
	display: flex;
	align-items: center; 
}

#about main #corporate {
	margin: 30px 0 15px 0;
}

#about main #corporate h3 {
	margin: 15px 0;
	text-align: center;
	font-size: 20px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#about main #corporate table {
	width: 100%;
}

#about main #corporate table th {
	width: 3em;
	padding: 15px 0 15px 15px;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	vertical-align: top;
	font-weight: 400;
}

#about main #corporate table td {
	padding: 15px;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	vertical-align: top;
}

#about main #history {
	margin: 30px 0 15px 0;
}

#about main #history h3 {
	margin: 15px 0;
	text-align: center;
	font-size: 20px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#about main #history table {
	width: 100%;
}

#about main #history table th {
	width: 5.8em;
	padding: 15px 0 15px 15px;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	vertical-align: top;
	font-weight: 400;
}

#about main #history table td {
	padding: 15px;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	vertical-align: top;
}

#about main #publicinformation {
	margin: 30px 0 15px 0;
}

#about main #publicinformation h3 {
	margin: 15px 0;
	text-align: center;
	font-size: 20px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#about main #publicinformation .container {
	margin: 0 15px;
}

#about main #publicinformation .container div {
	margin: -1px 0 0 0;
	padding: 15px;
	border: 1px solid #ccc;
	box-sizing: border-box;
}

#about main #publicinformation .container div h4 {
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#about main #publicinformation .container div ul,
#about main #publicinformation .container div li {
	margin: 0;
	padding: 0;
	list-style: none;
}

#about main #publicinformation .container div:first-child li a {
	text-decoration: underline;
}

/*----------------------------------------------------
	Activities
 ----------------------------------------------------*/

#activitiesindex h2 {
	margin: 15px;
}

#activitiesindex main #statement {
	width: auto;
	margin: 30px 15px 15px 15px;
}


#activitiesindex main #statement h3 {
	margin: 30px 0 0 0;
	font-size: 20px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#activitiesindex main #activities h2 {
	margin: 15px;
}

#activitiesindex main #activities .container {
	width: calc(100% - 30px);
	padding: 15px;
	background: #f6f6f6;
}

#activitiesindex main #activities a.item,
#activitiesindex main #activities a.item:link,
#activitiesindex main #activities a.item:visited {
	opacity: 1;
	background: #fff;
	border: 1px solid #f6f6f6;
}

#activitiesindex main #activities a.item:hover,
#activitiesindex main #activities a.item:active {
	opacity: 1;
	border: 1px solid #ccc;
}

#activitiesindex main #activities .container .item.container {
	display: flex;
	box-sizing: border-box;
	width: calc(100% - 2px);
	padding: 0;
	gap: 0;
	background: #fff;
}

#activitiesindex main #activities .container .item.container .image {
	width: 140px;
	aspect-ratio: 1 / 1;
}

#activitiesindex main #activities .container .item.container .image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

#activitiesindex main #activities .container .item.container .content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: calc(100% - 120px);
	padding: 10px;
	font-size: 12px;
}

#activitiesindex main #activities .container .item.container .content h3 {
	margin: 0;
	font-weight: 500;
}

#activitiesindex main #activities .container .item.container .content p {
	margin: 0;
}

#activitiesindex main #activities .container .item.container .content .more {
	margin: auto 0 0 0;
	text-align: right;
	line-height: 1;
}

/*----------------------------------------------------
	Hachimitsu
 ----------------------------------------------------*/

#hachimitsu .path {
	margin: 20px 15px 0 15px;
	font-size: 15px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#hachimitsu h2 {
	margin: 0 15px 15px 15px;
}

#hachimitsu main #philosophy h3 {
	margin: 15px 0;
	text-align: center;
	font-size: 20px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#hachimitsu main #philosophy .content {
	margin: 15px auto;
}

#hachimitsu main #philosophy .content h4 {
	margin: 15px 0 0 0;
	font-size: 18px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#hachimitsu main #philosophy .content h4 + p {
	margin-top: 0;
}

#hachimitsu main #policy h3 {
	margin: 15px 0;
	text-align: center;
	font-size: 20px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#hachimitsu main #policy .content {
	margin: 60px auto;
}

#hachimitsu main #policy .content h4 {
	margin: 40px 0 0 0;
	font-size: 18px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#hachimitsu main #policy .content h4 + p {
	margin-top: 0;
}

#hachimitsu main #outline {
	width: calc(100% - 30px);
	margin: 15px;
}

#hachimitsu main #outline .container {
	display: flex;
	margin: 0 0 15px 0;
}

#hachimitsu main #outline .container .col4 {
	width: calc(100% / 3);
}

#hachimitsu main #outline .container + .content {
	margin: 0;
}

#hachimitsu main #methods h3 {
	margin: 15px;
	text-align: center;
	font-size: 25px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#hachimitsu main #methods .content {
	margin: 60px auto;
}

#hachimitsu main #schedule h3 {
	margin: 15px 0;
	text-align: center;
	font-size: 20px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#hachimitsu main #schedule .container {
	margin: 0 auto;
}

#hachimitsu main #schedule .content {
	width: calc(100% - 30px);
	margin: 15px;
}

#hachimitsu main #schedule .content h4 {
	margin: 0 0 0 0;
	font-size: 15px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#hachimitsu main #schedule .content h4 + p {
	margin-top: 0;
}

#hachimitsu main #action {
	width: calc(100% - 60px);
	margin: 15px;
	padding: 15px;
	background: #f0f0f0;
}

#hachimitsu main #action h3 {
	margin: 0 0 15px 0;
	text-align: center;
	font-size: 15px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#hachimitsu main #action ul {
	list-style: none;
	margin: 0 auto;
	padding: 0;
}

#hachimitsu main #action ul li:first-child {
	margin-bottom: 15px;
}

#hachimitsu main #action ul li a {
	width: 100%;
	text-align: center;
	box-sizing: border-box;
}

/*----------------------------------------------------
	Honeycom
 ----------------------------------------------------*/

#honeycom .path {
	margin: 20px 15px 0 15px;
	font-size: 15px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#honeycom h2 {
	margin: 0 15px 15px 15px;
}

#honeycom main #outline {
	width: calc(100% - 30px);
	margin: 15px;
}

#honeycom main #outline h3 {
	margin: 15px 0;
	text-align: center;
	font-size: 20px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#honeycom main #outline .content {
	margin: 15px auto;
}

#honeycom main #outline .container {
	display: flex;
	margin: 0 0 15px 0;
}

#honeycom main #outline .container .col4 {
	width: calc(100% / 3);
}

#honeycom main #outline .container img {
	aspect-ratio: 1 / 1;
	object-fit: cover;
}

#honeycom main #outline .container + .content {
	margin: 0;
}

#honeycom main #action {
	width: calc(100% - 60px);
	margin: 15px;
	padding: 15px;
	background: #f0f0f0;
}

#honeycom main #action h3 {
	margin: 0 0 15px 0;
	text-align: center;
	font-size: 15px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#honeycom main #action ul {
	list-style: none;
	margin: 0 auto;
	padding: 0;
}

#honeycom main #action ul li:first-child {
	margin-bottom: 15px;
}

#honeycom main #action ul li a {
	width: 100%;
	text-align: center;
	box-sizing: border-box;
}

/*----------------------------------------------------
	Sagyosho
 ----------------------------------------------------*/

#sagyosho .path {
	margin: 20px 15px 0 15px;
	font-size: 15px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#sagyosho h2 {
	margin: 0 15px 15px 15px;
}

#sagyosho main #outline {
	width: calc(100% - 30px);
	margin: 15px;
}

#sagyosho main #outline h3 {
	margin: 15px 0;
	text-align: center;
	font-size: 20px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#sagyosho main #outline .content {
	margin: 15px auto;
}

#sagyosho main #schedule h3 {
	margin: 15px 0;
	text-align: center;
	font-size: 20px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#sagyosho main #schedule .container {
	margin: 0 auto;
}

#sagyosho main #schedule .content {
	width: calc(100% - 30px);
	margin: 15px;
}

#sagyosho main #schedule .content h4 {
	margin: 40px 0 0 0;
	font-size: 18px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#sagyosho main #schedule .content h4 + p {
	margin-top: 0;
}

#sagyosho main #action {
	width: calc(100% - 60px);
	margin: 15px;
	padding: 15px;
	background: #f0f0f0;
}

#sagyosho main #action h3 {
	margin: 0 0 15px 0;
	text-align: center;
	font-size: 15px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#sagyosho main #action ul {
	list-style: none;
	margin: 0 auto;
	padding: 0;
}

#sagyosho main #action ul li:first-child {
	margin-bottom: 15px;
}

#sagyosho main #action ul li a {
	width: 100%;
	text-align: center;
	box-sizing: border-box;
}

/*----------------------------------------------------
	Awai
 ----------------------------------------------------*/

#awai .path {
	margin: 20px 15px 0 15px;
	font-size: 15px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#awai h2 {
	margin: 0 15px 15px 15px;
}

#awai main #outline {
	width: calc(100% - 30px);
	margin: 15px;
}

#awai main #outline h3 {
	margin: 15px 0;
	text-align: center;
	font-size: 20px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#awai main #outline .content {
	margin: 15px auto;
}

#awai main #action {
	width: calc(100% - 60px);
	margin: 15px;
	padding: 15px;
	background: #f0f0f0;
}

#awai main #action h3 {
	margin: 0 0 15px 0;
	text-align: center;
	font-size: 15px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#awai main #action ul {
	list-style: none;
	margin: 0 auto;
	padding: 0;
}

#awai main #action ul li:first-child {
	margin-bottom: 15px;
}

#awai main #action ul li a {
	width: 100%;
	text-align: center;
	box-sizing: border-box;
}

/*----------------------------------------------------
	CCC
 ----------------------------------------------------*/

#ccc .path {
	margin: 20px 15px 0 15px;
	font-size: 15px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#ccc h2 {
	margin: 0 15px 15px 15px;
}

#ccc main #outline {
	width: calc(100% - 30px);
	margin: 15px;
}

#ccc main #outline h3 {
	margin: 15px 0;
	text-align: center;
	font-size: 20px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#ccc main #outline .container {
	display: flex;
	margin: 0 0 15px 0;
}

#ccc main #outline .container .col4 {
	width: calc(100% / 3);
}

#ccc main #outline .container + .content {
	margin: 0;
}

#ccc main #action {
	width: calc(100% - 60px);
	margin: 15px;
	padding: 15px;
	background: #f0f0f0;
}

#ccc main #action h3 {
	margin: 0 0 15px 0;
	text-align: center;
	font-size: 15px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#ccc main #action ul {
	list-style: none;
	margin: 0 auto;
	padding: 0;
}

#ccc main #action ul li:first-child {
	margin-bottom: 15px;
}

#ccc main #action ul li a {
	width: 100%;
	text-align: center;
	box-sizing: border-box;
}

/*----------------------------------------------------
	Kikan
 ----------------------------------------------------*/

#kikan .path {
	margin: 20px 15px 0 15px;
	font-size: 15px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#kikan h2 {
	margin: 0 15px 15px 15px;
}

#kikan main section {
	width: calc(100% - 30px);
	margin: 15px;
}

#kikan main section h3 {
	margin: 15px 0;
	text-align: center;
	font-size: 20px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#kikan main section .content {
	margin: 15px auto;
}

#kikan main #action {
	width: calc(100% - 60px);
	margin: 15px;
	padding: 15px;
	background: #f0f0f0;
}

#kikan main #action h3 {
	margin: 0 0 15px 0;
	text-align: center;
	font-size: 15px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#kikan main #action ul {
	list-style: none;
	margin: 0 auto;
	padding: 0;
}

#kikan main #action ul li:first-child {
	margin-bottom: 15px;
}

#kikan main #action ul li a {
	width: 100%;
	text-align: center;
	box-sizing: border-box;
}

/*----------------------------------------------------
	News Index
 ----------------------------------------------------*/

#newsindex h2 {
	margin: 15px;
}

#newsindex main #news {
	margin: 15px 0;
}

#newsindex main #news #dropdownnav {
	margin: 15px;
}

#newsindex main #news #dropdownnav > div {
	display: flex;
	align-items: center;
	margin: 0 0 15px 0;
}

#newsindex main #news #dropdownnav div h3 {
	width: 180px;
	font-size: 15px;
	
}

#newsindex main #news #newslist li {
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid #ccc;
}

#newsindex main #news #newslist {
	margin: 30px 0 0 0;
	padding: 0;
}

#newsindex main #news #newslist li:last-child {
	border-bottom:1px solid #ccc;
}

#newsindex main #news #newslist li a,
#newsindex main #news #newslist li a:link,
#newsindex main #news #newslist li a:visited {
	padding: 15px;
	background: #fff;
	opacity: 1;
}

#newsindex main #news #newslist li a:hover,
#newsindex main #news #newslist li a:active {
	background: #f6f6f6;
}

#newsindex main #news #newslist li time {
	display: block;
}

#newsindex main #news #newslist li .category {
	display: block;
}

#newsindex main #news #newslist li .text {
	display: block;
}

#newsindex main #news #pagenav {
	display: flex;
	justify-content: center;
	list-style: none;
	padding: 0;
	margin: 60px 0;
	gap: 8px;
}

#newsindex main #news #pagenav li {
	display: inline-block;
}

#newsindex main #news #pagenav li a,
#newsindex main #news #pagenav li.active {
	display: inline-block;
	width: 32px;
	height: 32px;
	line-height: 32px;
	text-align: center;
	text-decoration: none;
	color: black;
	border-radius: 50%;
	border: 1px solid #fff;
}

#newsindex main #news #pagenav li.active {
	border: 1px solid black;
}

#newsindex main #news #pagenav li a:hover {
	border-radius: 50%;
	border: 1px solid #000;
	opacity: 1;
}

/*----------------------------------------------------
	News Detail
 ----------------------------------------------------*/

#newsdetail h2 {
	margin: 15px;
}

#newsdetail main #news {
	margin: 15px 0;
}

#newsdetail main #news #dropdownnav {
	margin: 15px;
}

#newsdetail main #news #dropdownnav > div {
	display: flex;
	align-items: center;
	margin: 0 0 15px 0;
}

#newsdetail main #news #dropdownnav div h3 {
	width: 180px;
	font-size: 15px;
	
}

#newsdetail main #news article {
	width: calc(100% - 30px);
	margin: 30px 15px 15px 15px;
}

#newsdetail main #news article h3 {
	font-size: 20px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#newsdetail main #news article section {
	margin-top: 15px;
}

#newsdetail main #news article section + p {
	text-align: center;
}

#newsdetail main #news article section img {
	width: 100%;
}

/*----------------------------------------------------
	Recruit
 ----------------------------------------------------*/

#recruit h2 {
	margin: 15px;
}

#recruit main #philosophy {
	width: calc(100% - 30px);
	margin: 15px;
}

#recruit main #philosophy > div {
	margin: 0 0 40px 0;
}

#recruit main #philosophy > div h3 {
	font-size: 20px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#recruit main #philosophy .contentstopbtn {
}

#recruit main #philosophy .contentstopbtn p {
}

#recruit main #philosophy .contentstopbtn p a {
	display: block;
	width: 100％;
}

#recruit main #philosophy .container {
	display: block;
	width: calc(100% - 2px);
	margin: 0 0 -1px 0;
	border: 1px solid #ccc;
	box-sizing: border-box;
	gap: 0;
}

#recruit main #philosophy .container .image {
	width: 100%;
	border-bottom: 1px solid #ccc;
}

#recruit main #philosophy .container .image img {
	width: 100%;
	height: auto;
	object-fit: cover;
}

#recruit main #philosophy .container .text {
	width: 100%;
}

#recruit main #philosophy .container .text .about {
	padding: 15px;
	border-bottom: 1px solid #ccc;
}

#recruit main #philosophy .container .text .activities {
	padding: 15px;
	border-bottom: 1px solid #ccc;
}

#recruit main #philosophy .container .text .environment {
	padding: 15px;
}

#recruit main #philosophy .container .text h4 {
	font-size: 15px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#recruit main #sempai {
	width: calc(100% - 30px);
	margin: 40px 15px;
}

#recruit main #sempai > div h3 {
	font-size: 20px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#recruit main #sempai .container {
	display: flex;
	gap: 15px;
	overflow-x: auto;
	padding-bottom: 10px;

	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
}

#recruit main #sempai .container .profile {
	flex: 0 0 85%;
	border: 1px solid #ccc;
	background: #fff;
	box-sizing: border-box;
	cursor: pointer;

	scroll-snap-align: start;
}

#recruit main #sempai .container .profile.active,
#recruit main #sempai .container .profile:hover {
	background-color: #f0f0f0;
}

#recruit main #sempai .container .profile img {
	width: 100%;
	height: auto;
	object-fit: cover;
	aspect-ratio: 3 / 2;
}

#recruit main #sempai .container .profile h4 {
	margin: 15px 15px 0 15px;
	font-size: 15px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#recruit main #sempai .container .profile p {
	margin: 0 15px 15px 15px;
}

#recruit main #sempai .container .profile h5 {
	margin: 15px;
	font-size: 15px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#recruit main #sempai .container .case {
	display: none;
}

#recruit main #sempai .container .case.show {
	display: block !important;
}

#recruit main #sempai .case h4 {
	margin: 15px 0 0 0;
	font-size: 18px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#recruit main #sempai .case .schedule {
	position: relative;
	margin: 30px 0 0 0;
	padding: 20px;
	background: #f0f0f0;
}

#recruit main #sempai .case .schedule h5 {
	margin: 0 0 20px 0;
	font-size: 15px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#recruit main #sempai .case .schedule table {
	width: 100%;
}

#recruit main #sempai .case .schedule table td {
	padding: 5px 20px 5px 0;
}

#recruit main #sempai .case .schedule .comment {
	position: static;
	width: 100%;
	margin-top: 20px;
	text-align: center;
}

#recruit main #sempai .case .schedule .comment img {
	width: 120px;
	height: 120px;
	object-fit: cover;
	aspect-ratio: 1 / 1;
	border-radius: 60px;
}

#recruit main #recruitment {
	width: calc(100% - 30px);
	margin: 40px 15px;
}

#recruit main #recruitment h3 {
	margin: 0 0 15px 0;
	font-size: 20px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

.occupation-item {
	margin-bottom: 1px;
}

.occupation-item button {
	color: #000;
}

.occupation-summary {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 14px 40px 14px 15px;
	background: #ffd200;
	border: 0;
	cursor: pointer;
	text-align: left;
	position: relative;
	font: inherit;
	box-sizing: border-box;
}

.occupation-summary::after {
	content: "+";
	position: absolute;
	right: 15px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 1.2em;
	line-height: 1;
}

.occupation-item.is-open .occupation-summary::after {
	content: "−";
}

.occupation-summary:hover,
.occupation-item.is-open .occupation-summary {
	background: #ffb61c;
}

.occupation-detail {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.4s ease;
}

#recruit main #recruitment table,
#recruit main #recruitment tbody,
#recruit main #recruitment tr,
#recruit main #recruitment th,
#recruit main #recruitment td {
	display: block;
	width: 100%;
	box-sizing: border-box;
}

#recruit main #recruitment table th {
	margin: -1px 0 0 0;
	padding: 10px 0 0 0;
	border-top: 1px solid #ccc;
	border-bottom: none;
	vertical-align: top;
	font-weight: 400;
}

#recruit main #recruitment table td {
	padding: 0 0 10px 0;
	border-top: none;
	border-bottom: 1px solid #ccc;
	vertical-align: top;
}

#recruit main #recruitment table tr:first-child th {
	border-top: none;
}

#recruit main #recruitment table tr:last-child td {
	border-bottom: none;
}

#recruit main #action {
	width: calc(100% - 60px);
	margin: 15px;
	padding: 15px;
	background: #f0f0f0;
}

#recruit main #action h3 {
	margin: 0 0 15px 0;
	text-align: center;
	font-size: 15px;
	font-weight: 600;
	font-family: "hrdo-700", Zen Kaku Gothic New, "Yu Gothic Medium", sans-serif;
}

#recruit main #action ul {
	list-style: none;
	margin: 0 auto;
	padding: 0;
}

#recruit main #action ul li:first-child {
	margin-bottom: 15px;
}

#recruit main #action ul li a {
	width: 100%;
	text-align: center;
	box-sizing: border-box;
}

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

#contact h2 {
	margin: 15px;
}

#contact main .screen-reader-response {
	margin: 15px;
}

#contact main .screen-reader-response ul {
	display: none;
}

#contact main form {
	margin: 15px;
}

#contact main form .wpcf7-not-valid-tip {
	margin: -16px 0 16px 0;
	font-size: 13px;
	color: #ff0066;
}

#contact main form .wpcf7-response-output {
	margin: 0;
	padding: 0;
	border: none;
}

#contact main form .wpcf7-spinner {
	visibility: hidden !important;
}

#contact main form input {
	box-sizing: border-box;
	width: 100%;
	margin: 0 0 20px 0;
	padding: 10px;
	border: 1px solid #ccc;
	font-size: 13px;
	color: #000;
}


#contact main form .wpcf7-list-item {
	display: block;
}

#contact main form input[type="checkbox"] {
	width: auto;
	margin: 0 10px 0 0;
}

#contact main form textarea {
	box-sizing: border-box;
	display: block;
	width: 100%;
	margin: 0;
	margin: 0 0 20px 0;
	padding: 10px;
	border: 1px solid #ccc;
	font-size: 13px;
	color: #000;
}

#contact main form input.wpcf7-submit {
	padding: 15px 20px;
	border: none;
	font-weight: 600;
	background: #ffd200;
}

#contact main form input.wpcf7-submit:hover,
#contact main form input.wpcf7-submit:active {
	opacity: 1;
	background: #ffb61c;
}
