@charset "utf-8";
:root {
	/*text-color*/
	--main-color: #2E4864;
	--accent-color:  #09a392;
	--blue-color: #057bc0;
	--white-color: #fff;
	--caution-color: #ed6d1f;
	--gray-color:#f5f5f5;
	--yellow-color:#FEF263;

	/*background-color*/
	--bg-main: #fff;
	--bg-light: #fff;
	--bg-white: #fff;
	--bg-dark:#f4f9ff;
	--bg-hover:#09a392;

	/*font-size*/
	--fs-biggest:24pt;
	--fs-bigger:20pt;
	--fs-big:16pt;
	--fs-normal:14pt;
	--fs-small:10pt;

	/*font-family*/
	--ff-big:YakuHanJP,'Trebuchet MS','Lato','Urbanist','Zen Kaku Gothic Antique', sans-serif;
	--ff-normal: YakuHanJP,'Trebuchet MS','Lato',"Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体",'Zen Kaku Gothic Antique', "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
	--ff-italic: YakuHanJP,'Josefin Sans', sans-serif;
}


/*animate.css用*/

.fadeInUpTrigger,.fadeInRightTrigger,.slideInUpTrigger,.slideInRightTrigger,.fadeInDownTrigger,.slideInLeftTrigger,.fadeInRightTrigger,.fadeInLeftTrigger,.fadeInTrigger{
	opacity: 0;
}

.animate__animated{
	opacity:1;
}

@keyframes slideInRight {
    0% {
        -webkit-transform: translate3d(15%,0,0);
        transform: translate3d(15%,0,0);
        visibility: visible
    }

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes slideInLeft {
    0% {
        -webkit-transform: translate3d(-15%,0,0);
        transform: translate3d(-15%,0,0);
        visibility: visible
    }

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}


/*ページ共通*/
*{
	scroll-behavior: auto!important;
}

i.fa-calendar-alt{
	padding-right: 0.5rem!important;
}

.article_title i{
	padding-left: 0.5rem!important;
}

.bg-change{
	background-color: var(--bg-main);
}

.dropdown-menu{
	border: none!important;
	background-color: rgba(0, 0, 0, 0);
}

.dropdown-item{
	font-weight: 500!important;
}

body{
	font-family:var(--ff-big);
	font-weight: bold;
	color: var(--main-color);
	width: 100%;
	overflow: hidden;
}

.bg {
	animation:slide 2s ease-in-out infinite alternate;
	background-image: linear-gradient(-60deg, #e4f3f9 50%, #f4f5d7 50%);
	bottom:0;
	left:-50%;
	opacity:.5;
	position:fixed;
	right:-50%;
	top:0;
	z-index:-1;
}

.bg2 {
	animation-direction:alternate-reverse;
	animation-duration:3s;
}

.bg3 {
	animation-duration:4s;
}

@keyframes slide {
  0% {
    transform:translateX(-25%);
  }
  100% {
    transform:translateX(25%);
  }
}

h1,h2{
	color: var(--blue-color);
}

a{
	color: var(--main-color)!important;
	text-decoration: none;
}

/*a:hover{
	background-color: var(--bg-hover);
}*/

header nav li > a:hover{
	color: var(--bg-hover)!important;
}

section a{
	transition: 0.2s;
}

p,address{
	font-family:var(--ff-normal);
	font-weight: bold;
	color: var(--main-color);
	font-size: 12pt!important;
}

section p{
	margin-bottom: 0.5em;
}

ul{
	list-style-type: none;
}

section li{
	margin-bottom: 0.5em;
}

section ul > li:nth-of-type(1){
	margin-top: 0.5em;
}

.italic{
	font-family:var(--ff-italic)!important;
	font-weight: 300;
	font-style: italic;
}

.icon{
	width: 1.5rem;
}

section{
	position: relative;
/*	padding-top: 2rem!important;*/
	padding-bottom: 24rem!important;
}

.sub_page section:last-of-type{
	padding-bottom: 4rem!important;
}

.sub_inquiry section:last-of-type{
	padding-bottom: 0rem!important;
}

/*header,nav*/

header#main_visual{
	height: 100vh;
	width: 100%;
/*	background: 0% 40% / cover no-repeat url(../img/home_mainvisual01.jpg);*/
	margin-bottom: 4rem!important;
	position: relative;
	overflow: hidden;
}

header > .catchcopy,#topPage header > span{
	content: "";
	position: absolute;
	color: var(--blue-color);
	left: 3rem!important;
	z-index: 5;
	transform: rotate(-5deg);
}

header > .catchcopy{
	font-size: 80pt;
	bottom: calc(25pt + 7rem);
	display: inline-block;
}

header > .catchcopy > span {
	display: inline-block;
}

header > .catchcopy > span + span{
	padding: 0!important;
	margin: 0!important;
	margin-left: -1.5rem!important;
}

body.Android header > .catchcopy > span{
	color: pink!important;
}

body.Android header > .catchcopy > span + span{
	margin-left: 20rem!important;
}

#topPage header > .catchcopy:before{
	content: "";
	background-color: rgba(255, 255, 255, 0.75);
	width: 10.5em;
	height: 1.5em;
	display: block;
	position: absolute;
	left: -4rem;
	bottom: 0;
	z-index: -1;
}

#topPage header > span.catchcopy_small{
	font-size: 25pt;
	bottom: 5rem;
}

/*#topPage header > span.catchcopy_small:before{
	content: "";
	background-color: rgba(255, 255, 255, 0.5);
	width: 28em;
	height: 0.8em;
	display: block;
	position: absolute;
	left: -4rem;
	bottom: 0;
	z-index: -1;
}*/

#topPage header > span.catchcopy_small:before{
	content: "";
	background-color: rgba(255, 255, 255, 0.75);
	width: 32em;
	height: 1.5em;
	display: block;
	position: absolute;
	left: -4rem;
	bottom: 0;
	z-index: -1;
	line-height: 1em!important;
}

.catchcopy span:nth-child(1){
	animation-delay: 0s;
}

.catchcopy span:nth-child(2) {
  animation-delay: 0.1s;
}

.catchcopy span:nth-child(3) {
  animation-delay: 0.2s;
}

.catchcopy span:nth-child(4) {
  animation-delay: 0.3s;
}

.catchcopy span:nth-child(5) {
  animation-delay: 0.35s;
  width: 0.5em;
}

.catchcopy span:nth-child(6){
  animation-delay: 0.4s;
  color: var(--accent-color);
}

.catchcopy span:nth-child(7) {
  animation-delay: 0.5s;
  color: var(--accent-color)
}
.catchcopy span:nth-child(8) {
  animation-delay: 0.6s;
}

.catchcopy span:nth-child(9) {
  animation-delay: 0.7s;
}

.catchcopy span:nth-child(10) {
  animation-delay: 0.75s;
  width: 0.5em;
}

#main_visual > img{
	position: absolute;
	opacity:0;
	transition:all 1s ease-in-out;
	height:100%;
	width: 100%;
	top: 0;
	left: 0;
	object-fit:cover;
	transition: 0.8s;
}

#main_visual > img.mainvisual3{
	object-position: 0% 25%;
}

#main_visual > img.show{
	opacity: 1;
}


header > div ul li a{
	color: var(--main-color)!important;
}

.logo_images{
	position: relative;
}

header .first_logo{
	min-width: 100px;
	max-width: 200px;
	position: absolute;
	z-index: 2;
	filter: drop-shadow(3px 3px 5px rgba(43,57,72,0.1));
	opacity: 0;
	left: 1rem;
}

.js_logo{
	/*min-width: 150px!important;
	max-width: 280px!important;*/
	width: 250px!important;
	opacity: 0;
	position: absolute;
	z-index: 1;
	left: 1rem;
}

.sub_page .header_logo{
	min-width: 150px!important;
   max-width: 280px!important;
}

/*.logo_small{
	min-width: 70px!important;
	max-width: 100px!important;
}*/

footer .footer_logo{
	/*min-width: 150px!important;
	max-width: 280px!important;*/
}

.site_name{
	font-size: var(--fs-small);
	vertical-align: middle;
	font-weight: bold;
	height: max-content;
	margin-left: 1.2rem;
}

header .site_name{
	font-size: var(--fs-normal);
}

header > div{
	position: relative;
}

header > div:first-child::before{
	content: "";
	background-color: var(--blue-color);
	height: 5px;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	display: block;
}

header ul li.nav-item{
	margin-right: 0.8rem;
}

header ul li > a{
	padding-top: 0rem!important;
}

ul li.for_users{
	display: flex;
	justify-content: right;
	align-items: center;
	margin-bottom: 0.5rem!important;
	padding-top: 0.5rem!important;
}

header ul li.for_users > a{
	text-align: right!important;
	font-size: var(--fs-small);
	padding-top: 0.15rem!important;
	padding-bottom: 0.25rem!important;
	color: var(--blue-color)!important;
}

ul li.for_users img.icon{
	height: 1rem!important;
	width: auto!important;
	margin-right: 0.5rem;
}

ul li.for_users img.white-icon{
	display: none!important;
}

header ul li.for_users > a:hover{
	color: var(--bg-hover)!important;
}

header ul li.for_users > a:hover .icon{
	display: none;
}

header ul li.for_users > a:hover .d-none-icon{
	display: block;
}


header ul li.for_users span{
	margin-top: 0.18rem!important;
}

.header_nav{
	height: 100px!important;
	z-index: 5000!important;
}

.navbar {
	flex-wrap: nowrap;
}

.navbar-brand:hover{
	color: var(--bg-hover)!important;
}

.navbar-nav{
	flex-direction: column!important;
}

header .navbar-nav a{
	color: var(--blue-color)!important;
}


/*追従ボタン*/

.fixed_buttons{
	display: flex;
	position: fixed;
	bottom: 0;
	right: 1rem!important;
	background-color: transparent;
	width: max(30% , 550px);
	z-index: 500;
}

.fixed_buttons > a{
	clip-path: polygon(calc(100% - 20px) 0, 100% 20px, 100% 100%, 0 100%, 0 0);
	padding-bottom: 1rem!important;
	padding-top: 1rem!important;
	background-color: var(--caution-color);
	color: var(--white-color)!important;
	font-size: 12pt!important;
	font-weight: 500!important;
	width: 50%;
	text-align: center;
	padding:0.7rem 1.5rem!important;
	transition: 0.2s;
}

.fixed_buttons > a:nth-of-type(2){
	background-color: var(--accent-color)!important;
}

.fixed_buttons > a + a{
	border-left: none;
	margin-left: 1rem;
}

.fixed_buttons a:hover{
	background-color: var(--blue-color)!important;
	color: var(--white-color)!important;
}

.fixed_buttons img.icon{
	margin-right: 1rem;
}

.fixed_text{
	margin-top: 0.2rem!important;
	font-size: var(--fs-big);
}

/*top_h2,sub_h3*/
h2{
	font-size: var(--fs-biggest)!important;
	z-index: 5;
	font-weight: bold!important;
}

h2:not(.top_info_title){
	position: relative;
	padding: 0.8rem 8rem 0.8rem 3rem!important;
	margin-bottom: 1.5rem!important;
	width: max-content!important;
	color: var(--white-color);
	margin-left: -4.8rem;
	background-color: var(--blue-color);
}

.sub_event-list h2{
	width: fit-content!important;
}

h2:not(.top_info_title):before{
	content: "";
	position: absolute;
	border-right: 17px solid transparent;
	border-bottom: 17px solid var(--main-color);
	border-left: 17px solid transparent;
	bottom: -14px;
	left: 1.3px;
	transform: rotate(45deg);
}

.top-oshirase{
	text-align: center;
}

.top_info_box{
	padding-inline: 0!important;
}

h2.top_info_title{
	text-align: center;
	padding: 0.8rem 0rem!important;
	margin-bottom: 0.5rem;
	margin-inline: 2rem;
	color: var(--accent-color)!important;
}

.top_info{
	border: 3px solid var(--accent-color);
	padding: 1rem 0!important;
	margin:1rem 0 5rem!important;
	background-color: var(--white-color);
}

.top_info div{
	margin: 1rem 2rem 1rem!important;
	font-size: var(--fs-normal)!important;
}

.top_info div:not(:last-child){
	border-bottom: 1px dotted var(--main-color);
	padding-bottom: 1rem!important;
}





/*.top_news h2::after{
	content: "News";
}

.top_event h2::after{
	content: "Event";
}

.top_office h2::after{
	content: "Office";
}

.top_service h2::after{
	content: "Service";
}

#topPage h2::after{
	display: inline-block;
	background-color: var(--bg-dark);
	color: var(--blue-color);
	padding: 0.5rem;
	font-size: 15pt!important;
	font-family:var(--ff-italic)!important;
	font-weight: 300;
	font-style: italic;
	position: absolute;
	top: 1.8rem;
	right: 0;
}
*/
#topPage section:nth-of-type(1){
	margin-top: 0!important;
}

/*#topPage section:nth-child(even) > h2::after{
	background-color: var(--bg-light);
}

#topPage section:nth-child(even) > h2::before{
	background-color: var(--bg-main);
}*/

#topPage section,.sub_page section,.sub_floor section:not(:first-of-type){
	margin-top: -20rem!important;
}

.sub_event-list section{
	padding-bottom: 5rem!important;
}

.sub_event-list section:not(:first-of-type){
	margin-top: -3rem!important;
}

/*section:after,.sub_floor section:not(:first-of-type)::after{
	content:"";
	width: 100%;
	height: 100%;
	clip-path: polygon(calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%, 0 0);
}*/

#topPage section.top_service{
	padding-bottom: 24rem!important;
}

.sub_page section:first-of-type{
	margin-top: 3rem!important;
}

.sub_user section:first-of-type,.sub_company section:first-of-type{
	margin-top: 2rem!important;
}

section:nth-child(odd),.sub_page section:nth-of-type(even){
	border:2.5rem solid #fff ;
	border-style: inset;
	border-image: url(../img/bg_even.png) 50 fill round;
}

#topPage section:nth-child(even),.sub_page section:nth-of-type(odd){
	border:2.5rem solid #fff ;
	border-style: inset;
	border-image: url(../img/bg_odd.png) 50 fill round;
	border-image-outset:-50px;
}


/*トップページ－お知らせ、イベント*/


.top_article{
	padding-top: 1rem!important;
	padding-bottom: 1rem!important;
}

.catLabel{
	font-size: var(--fs-small)!important;
	background-color: var(--main-color)!important;
	padding: 0.35em 1em 0.2em;
	border-radius: 5px;
	color: #fff!important;
	margin-bottom: 0.5em;
	display: inline-block;
}

section .top_article + .top_article{
	border-top: 0.5px solid #ddd;
}


.closed_articles > .top_article:first-of-type{
	border-top: 0.5px solid #ddd;
}


.top_event > div + div{
	margin-top: 3rem;
}

.article_img{
	background: #fff;
	height:6.5em;
	margin-right: 2.5rem;
	display: flex; /* flexコンテナを作成 */
	align-items: center; /* 垂直方向に中央揃え */
	overflow: hidden;
	vertical-align: middle;
	margin-bottom: 1.5rem!important;
	padding: 0!important;
}

#topPage section:nth-child(odd) .top_article .article_img,.sub_event-list section:nth-child(even) .top_article .article_img{
	background: var(--gray-color);
}

.article_img img{
	max-width: 100%;
	max-height: 100%;
	margin: 0 auto;
}

.article_text{
	font-size: var(--fs-normal);
	margin-bottom: 1.5rem!important;
}

.article_title{
	text-align: left!important;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
}

.more_articles{
	margin-top: 3rem!important;
	text-align: center;
	border: 1px solid var(--accent-color);
	padding: 0.5rem;
	width: 100%!important;
	font-weight: 700;
	color: var(--accent-color);
	transition: 0.2s;
	background-color: transparent!important;
}

.more_articles:hover{
	background-color: var(--bg-hover)!important;
	color: var(--white-color);
	border-color: var(--bg-hover);
}

.more_articles .open{
	background-color: var(--blue-color)!important;
	color: var(--white-color)!important;
}

.reverse_colors{
	color: var(--white-color);
	background-color: var(--accent-color)!important;
}

.button_more{
/*	background-color: var(--accent-color);*/
	font-weight: 600!important;
	color: var(--accent-color)!important;
	border:1px solid var(--accent-color);
	display: inline-block;
	padding: 0.5rem 1rem;
	text-align: right!important;
}

.button_more:hover{
	background-color: var(--bg-hover);
	color: var(--white-color)!important;
	border-color: var(--bg-hover);
}

.top_news a{
	text-align: right!important;
}

.close{
	height: 0!important;
}

.open{
	height: auto!important;
}




/*トップページ－事業所案内*/

.top_office .row + .row{
	margin-top: 4rem!important;
	padding-top: 4rem!important;
	border-top: 1px solid #ddd;
}

.sm_title{
	font-size: var(--fs-bigger)!important;
	margin-bottom: 0.5rem!important;
}


/*トップページ－サービス概要*/

.service_content{
	height: max-content;
	overflow: hidden;
	width: 100%;
}

.service_content + .service_content{
	margin-top: 50px!important;
}

.service_title{
/*	margin-left: 1.2rem!important;*/
	font-size: var(--fs-normal)!important;
	margin-left: auto!important;
	margin-right:0!important;
	display: flex;
	flex-direction: column;
	align-items: center;
	-webkit-box-align: center;
}

.Android .service_title{
	align-items: center!important;
}

.service_title:nth-child(2){
	margin-left: 0!important;
	margin-right:auto!important;
}

.service_title > span{
	font-size: 70pt!important;
	color: var(--accent-color)!important;
	line-height: 70pt!important;
	padding-bottom: 0.25rem!important;
	border-bottom: 1px solid var(--accent-color);
}

.service_title > div{
	writing-mode: vertical-rl;
	margin-top: 1.5rem!important;
	letter-spacing: 0.2rem!important;
	font-size: var(--fs-bigger)!important;
}

.service_contents > div:nth-child(1) .service_img{
	background: 60% / cover no-repeat url(../img/counselor.jpg);
	height: 50vh;
}

.service_contents > div:nth-child(2) .service_img{
	background: 55% / cover no-repeat url(../img/event_info.jpg);
	height: 50vh;
}

.service_contents > div:nth-child(3) .service_img{
	background: 20% / cover no-repeat url(../img/weekly_fv.jpg);
	height: 50vh;
}

.service_contents .service_img{
	position: relative;
}

.service_contents > div:nth-child(1) .service_img::after{
	content: "相談申込へ";
}

.service_contents > div:nth-child(2) .service_img::after{
	content: "イベント一覧";
	bottom: 0!important;
	right: 0!important;
}

.service_contents > div:nth-child(3) .service_img::after{
	content: "求人情報へ";
	bottom: 0!important;
}

.service_img::after{
	background-color: var(--accent-color);
	clip-path: polygon(20px 0, 100% 0, 100% 100%, 0 100%, 0 20px);
	padding: 0.5rem 1.5rem!important;
	padding-top: 0.75rem!important;
	position: absolute;
	bottom: -2px;
	right: -2px;
	color: var(--white-color);
	font-weight: 500;
	transition: 0.2s;
}

.service_img:hover::after{
	background-color: var(--bg-white)!important;
	color: var(--accent-color);
}

/*interview*/


/*movie*/

#topPage .movie_section{
	margin-top: 4rem!important;
	padding-bottom: 20rem!important;
	width: 100% !important;
	padding-inline: 0 !important;
}

.movie_section {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	height: 0;
	margin-top: 2rem;
}

.sub_page .movie_section{
/*	margin-bottom: 5rem!important;*/
	padding-bottom: 50rem!important;
}

.movie_section .movie_title{
	font-size: var(--fs-biggest);
	position: relative;
	width: max-content;
	margin-right: auto;
	margin-left: auto;
	padding-top: 1rem;
	padding-bottom: 0.75rem;
	font-weight: 600;
}

.movie_section .movie_title:after{
	content: "";
	display: block;
	background-color: var(--accent-color);
	width: 3em!important;
	height: 1px!important;
	position: absolute;
	bottom: 0;
	left: calc(50% - 1.5em);
}

.movie_wrapper {
  width: 100%;
  position: relative;
  padding-top: 56.25%;
}

.movie_wrapper iframe {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  width: 80%;
  height: 80%;
}

/*.movie_wrapper iframe {
	position: absolute;
	top: 4.5rem!important;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	aspect-ratio: 4/3;
}*/

/*.sub_page .movie_wrapper{
	width: 560px!important;
	height: 315px!important;
}*/

/*.sub_page .movie_wrapper iframe {
	position: absolute;
	top: 5rem!important;
	left: 0;
	right: auto;
	height: ;
}*/

/*footer*/

footer{
	margin-top: 5rem!important;
	background-color: var(--bg-dark)!important;
}

footer > div:first-child{
	background-color: var(--bg-white);
}

.contact_img{
	background: 40% 50% / cover no-repeat url(../img/contact_img.jpg);
}

.contact_info{
	background-color: var(--blue-color);
}

.tel_contact{
	text-align: center;
	padding: calc(var(--bs-gutter-x) * .5);
}

.tel_contact > .justify-content-center{
	margin: calc(var(--bs-gutter-x) * .5) 0 0;
	margin-bottom: 0!important;
}

.tel_contact a > div{
	background-color: var(--white-color);
	border-radius: 20px;
	padding: 0.3rem;
	height: 5rem;
}


.tel_title{
	text-align: left;
	font-size: var(--fs-normal);
	font-family: var(--ff-italic)!important;
	font-weight: 300;
	color: var(--yellow-color);
	line-height: 1em;
	padding-bottom: 0.5rem;
	padding-inline: calc(var(--bs-gutter-x) * .75);
	border-bottom: 1px solid var(--yellow-color);
	text-shadow: 1px 1px 35px var(--blue-color);
}

.tel_title_jpn{
	font-size: var(--fs-bigger);
	font-family: var(--ff-normal)!important;
	font-weight: 600;
	line-height: 1.5em;
	padding-right: 1rem!important;
}

.tel_phonenumber{
	font-size: 24pt!important;
	color: var(--blue-color);
	letter-spacing: -0.05rem;
	margin-bottom: 0.5rem!important;
}

.tel_phonenumber .icon{
	width: 2rem!important;
	margin-right: 1rem;
}

.office_name{
	font-size: var(--fs-small);
	margin-top: 0.5rem!important;
}

.tel_contact > .row > a > div{
	color: var(--blue-color);
	height: 6rem!important;
}

.tel_contact > .row > a{
	margin-block: calc(1.5rem * .5)!important;
	transition: 0.2s;
}

.tel_contact a > div:hover{
	background-color: var(--accent-color);
	color: var(--white-color)!important;
}

.tel_contact a > div:hover .phonenumber{
	background-color: var(--accent-color);
	color: var(--white-color)!important;
}

/*.contact_other{
	background-color: var(--accent-color);
	display: flex;
	width: 100%;
	font-size: var(--fs-normal);
	text-align: center;
	position: relative;
	font-weight: 500;
}*/

.contact_other .icon{
	width: 2.5rem!important;
	margin-right: 1rem;
	margin-left: 1.5rem;
}

.contact_section a:nth-last-of-type(-n+3) .d-inline-block{
	font-size: var(--fs-big);
}

.d-none-icon{
	display: none;
}

.share_button{
	margin-top: 5rem!important;
	margin-inline: auto;
	text-align: center;
}

.contact_other > a{
	color: #fff!important;
	width: 50%;
	padding: 3rem 0;
	transition: 0.2s;
}

.contact_other > a:hover{
	background-color: var(--bg-hover);
}

.tel_contact a > div:hover .icon{
	display: none;
}

.tel_contact a > div:hover .d-none-icon{
	display: block;
}

.footer_contact{
		display: flex;
}

.footer_contact .contact_info{
	width: 50%;
}

.footer_contact .contact_img{
	width: 50%;
}

footer .navbar-nav{
	width: max-content!important;
	flex-direction: row!important;
	margin-top: 1.5rem!important;
	margin-bottom:1.5rem!important;
}

footer .navbar-nav .nav-item{
	padding-left: 0.75rem!important;
	padding-right: 0.75rem!important;
}

footer .navbar-nav .nav-item + .nav-item{
	margin-left: 0.5rem!important;
}

footer .navbar-nav .nav-item a:hover{
	color: var(--bg-hover)!important;
}

footer .site_name{
	color: var(--blue-color);
	font-size: var(--fs-normal)!important;
}

footer .logo_name{
	padding-top: 0.5rem;
	padding-bottom: 1.5rem;
}

footer ul li.for_users > a{
	padding:0!important;
}

footer ul li.for_users > a{
	text-align: left!important;
	font-size: var(--fs-small);
	color: var(--main-color)!important;
}

footer ul li.for_users > a + a{
	margin-left: 1.5rem!important;
}

footer ul li.for_users > a:hover{
	color: var(--bg-hover)!important;
}

footer ul li.for_users > a:hover .icon{
	display: none;
}

footer ul li.for_users > a:hover .d-none-icon{
	display: block;
}

footer .footer_office{
	font-size: var(--fs-small)!important;
	padding-top: 1.5rem!important;
	padding-bottom: 1.5rem!important;
	display: flex;
}

footer .footer_office > div{
	font-family: var(--ff-big);
	font-weight: 700;
	font-size: 11pt!important;
	margin-bottom: 0.25rem!important;
}

footer .footer_office > div + div{
	margin-left: 6%!important;
}

footer .footer_office address{
	font-size: var(--fs-small)!important;
	display: inline-block;
	text-align: left;
}

footer .footer_info{
	border-top: 1px solid var(--main-color);
	width: 97%!important;
}

footer .instagram{
	text-align: center;
	font-size: 1.5rem!important;
	position: relative;
	margin-top: -1rem;
	margin-bottom: 0.5rem;
}

footer .instagram::after{
	content: "";
	width: 10rem!important;
	height: 8px;
	background-color: rgba(255, 233, 40, 0.5);
	position: absolute;
	display: block;
	bottom: 3px;
	left: auto;
	right: auto;
	z-index: -1;

}

.follow_icons{
	margin-bottom: 1rem!important;
}

.follow_icons > a + a{
	margin-left: 1.5rem!important;
}

footer a.instagram:hover{
	color: var(--accent-color)!important;
}

footer .instagram img{
	margin-left: 1rem!important;
}

footer .privacy_policy{
	font-size: var(--fs-small);
	margin-top: 1rem!important;
	padding-bottom: 0.25rem;
	border-bottom: 1px solid var(--main-color);
	text-align: center;
	transition: 0.2s;
}

footer .privacy_policy:hover{
	color: var(--accent-color)!important;
	border-color: var(--accent-color)!important;
}

footer small{
	background-color: var(--blue-color);
	color: #fff;
	display: block;
	font-size: 8pt!important;
	font-weight: 300;
	text-align: center;
	padding: 0.75rem!important;
}


/*サブページ*/

.sub_top{
	margin-top: 15vh;
	height: 65vh!important;
	position: relative;
	width: 80%;
	margin-left: auto;
	margin-right: 0;
}

.sub_top::after{
	content: "";
	width:calc(75% + 0.6rem);
	height: 100%;
	background: repeating-linear-gradient(-45deg, rgba(255, 255, 255, 1), rgba(255, 255, 255, 1) 1px, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, 0) 6px);
	position: absolute;
	top: 0.5rem;
	right: 0rem;
	z-index: -2;
}

.sub_floor .sub_top{
	background: top right / 75% no-repeat url(../img/floor_fv.jpg);
}

.sub_voice .sub_top{
	background: top right / 75% no-repeat url(../img/counselor.jpg);
}

.sub_weekly .sub_top{
	background: top right / 75% no-repeat url(../img/weekly_fv.jpg);
}

.sub_event-list .sub_top{
	background: center right / 75% no-repeat url(../img/event-list_fv.jpg);
}

.sub_inquiry .sub_top{
	background: top right / 75% no-repeat url(../img/access_fv.jpg);
}

.sub_user .sub_top{
	background: center right / 75% no-repeat url(../img/user_fv.jpg);
}

.sub_company .sub_top{
	background: top right / 75% no-repeat url(../img/company_fv.jpg);
}

.sub_404 .sub_top{
	background: top right / 75% no-repeat url(../img/contact_img.jpg);
}

.sub_page header{
	margin-bottom: 2rem!important;
}

/*.sub_other h2,*/
h3{
	font-size: var(--fs-big);
	color: var(--blue-color);
	position: relative;
	width: max-content;
	margin-left: auto;
	margin-right: auto;
	font-weight: 600;
	margin-bottom: 1rem;
}

/*.sub_other h2:before,*/
h3:before{
	content: "";
	background-color: var(--blue-color);
	width: 0.75em;
	height: 1px;
	display: block;
	position: absolute;
	top: 0.5em;
	left: -2rem;
}

h3:after{
	content: "";
	background-color: var(--blue-color);
	width: 0.75em;
	height: 1px;
	display: block;
	position: absolute;
	top: 0.5em;
	right: -2rem;
}

.sub_page .title_box{
	background-color: var(--bg-light);
	min-width: 35%!important;
	max-width: 55%!important;
	position: relative;
	padding-left: 5rem!important;
	padding-right: 2.5rem!important;
	padding-top: 1rem!important;
	padding-bottom: 1.5rem!important;
	margin-top: -4rem;
	margin-left: 0%;
	z-index: 5;
	box-shadow: 8px 8px 0px 0px #2E4864;
	border-radius: 0px;
}
/*
.sub_page .title_box::after{
	content: "";
	background-color: var(--bg-white);
	width: calc(100% - 0.5rem);
	height: calc(100% - 0.5rem);
	position: absolute;
	top: 0rem!important;
	left: 0rem!important;
	display: block;
	z-index: -50;
}*/

.title_eng{
	font-family: var(--ff-italic)!important;
	font-size: var(--fs-normal);
	color: var(--accent-color);
}

.sub_page h1{
	font-size: var(--fs-biggest)!important;
	font-weight: 700;
	letter-spacing: -0.01rem!important;
}

.sub_page section > div{
	padding-top: 1rem;
	padding-bottom: 0rem;
}



	.sub_floor .movie_section{
		margin-top:5rem!important;
	}


/*sub parts*/
.white_box{
	background-color: var(--bg-white)!important;
	color: var(--blue-color)!important;
	padding: 1rem!important;
	margin-top: 2rem!important;
	text-align: center;
}

.sub_overview{
	padding: 1rem!important;
	margin-top: 4rem!important;
	margin-bottom: 3.5rem!important;
	text-align: left;
}

.sub_event-list .sub_overview{
	margin-bottom: 0rem!important;
}

.sub_inquiry .sub_overview{
	margin-bottom: 1.5rem!important;
}

.btn{
	margin-inline: auto!important;
	display: block;
}

.btn > a,.button_submove{
	color: var(--main-color)!important;
	padding: 1rem 2rem!important;
	display: block!important;
	border-radius: 50px!important;
	margin-top: 1rem!important;
	width: min(100%, 550px)!important;
	margin:1rem auto!important;
	border: 1px solid var(--main-color)!important;
	font-size: 11pt!important;
	background-color: transparent!important;
	font-weight: 600!important;
}

.btn > a:hover,.button_submove:hover{
	background-color: var(--bg-hover)!important;
	border-color: var(--bg-hover)!important;
	color: var(--white-color)!important;
}

.sub_inquiry .button_submove{
	margin: 2rem auto 0!important;
}


.files{
	margin-top: 2rem!important;
}

.files > li{
	text-align: center;
}

.files > li > a{
	width: max-content!important;
	display: inline-block;
	width: min(100%, 550px)!important;
	margin-inline: auto;
}

.files > li + li{
	margin-top: 0.75rem!important;
}

.file_button{
	background-color: var(--gray-color)!important;
	position: relative;
	width: 100%!important;
	margin-left: auto;
	margin-right: auto;
	transition: 0.2s;
/*	font-size: var(--fs-small)!important;*/
}

section:nth-child(even) .file_button{
	background-color: var(--white-color)!important;
}

.sub_weekly section:nth-child(even) .file_button{
	background-color: var(--gray-color)!important;
}

.file_button:hover{
	color: var(--bg-hover);
}

.file_button:hover::before{
	background-color: var(--bg-hover)!important;
}

.file_button::before{
	content: "";
	background-color: var(--accent-color)!important;
	width: 0.5rem!important;
	height: 100%;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
}

/*.file_button:hover .icon{
	display: none;
}

.file_button:hover .d-none-icon{
	display: block;
}*/

.file_button img{
	width: 3rem!important;
	margin:1rem 1rem 1rem 2.5rem!important;
}

.file_button img.excel_icon{
	width: 2.5rem!important;
	margin:1rem 1.4rem 1rem 2.5rem!important;
}

.new_file{
	background-color: var(--caution-color)!important;
	border-radius: 50px;
	color: var(--white-color);
	padding: 0 0.5rem;
	width: max-content;
	font-size: var(--fs-small)!important;
	margin-bottom: 0.5rem!important;
}

.file_title{
	margin:1rem 2rem 1rem 1rem!important;
	text-align: left;
}

/*施設案内*/
/*.sub_floor section:nth-child(odd){
	background-color: var(--bg-dark);
}

.sub_floor section:nth-child(even){
	background-color: var(--bg-light);
}*/

/*.sub_floor h2{
	font-size: var(--fs-biggest)!important;
	font-family: var(--ff-big)!important;
	font-weight: 600;
}*/

.sub_anchor{
	text-align: center;
	margin-top: 5rem!important;
	margin-bottom: 4rem!important;
}

.sub_weekly .sub_anchor{
	margin-top: 0!important;
	margin-bottom: 0!important;
}

.anchor_sp{
	text-align: center!important;
}

.sub_anchor a{
	position: relative;
	display: inline-block;
	margin-left: 2em!important;
	padding-left: 1em;
}

/*
.sub_anchor a + a::before{
	content: "/";
	position: absolute;
	color: var(--main-color);
	left: -1.0em;
}*/

.sub_anchor a::before{
	content: "";
	position: absolute;
	width: 8px;
	height: 8px;
	display: block;
	background-color: var(--accent-color);
	transform: rotate(45deg);
	top: 7px;
	left: -10px;
}


.anchor{
    padding-top: 100px!important;
    margin-top: -100px!important;
}

.sub_anchor a{
	font-size: var(--fs-normal);
	font-family: var(--ff-normal);
	padding-bottom: 1rem!important;
/*	border-bottom: 1px solid var(--blue-color);*/
	line-height: calc(1em + 0.5rem)!important;
	color: var(--blue-color);
	text-align: left!important;
}

.sub_anchor a > div:hover{
	color: var(--bg-hover)!important;
}

.sub_floor section > .floor_content{
	padding-top: 1rem;
	margin-bottom: 3rem;
}

.floor_office{
	text-align: center;
}

.floor_office .facility_img{
	width: max(50%,300px)!important;
}

.floor_map h4{
	color: var(--blue-color)!important;
	font-weight: 700!important;
	font-size: var(--fs-big);
	text-align: left!important;
	position: relative;
	padding-left: 1.35em;
}
/*
.floor_map h4::first-letter{
	color: #fff;
	padding-inline: 0.5em;
	position: absolute;
	z-index: 2;
	top: 0;
	left: 0.25em;
}*/

.floor_map h4:before{
	content: "";
	background-color: var(--blue-color);
	width: calc(var(--fs-big) * 1.25);
	height: calc(var(--fs-big) * 1.25);
	border-radius: 50%;
	display: block;
	position: absolute;
	top: -0.05em;
	left: -0.1em;
	padding-top: 0.025em;
	padding-right: 0.25em;
	padding-left: 0.3em;
	z-index: 1;
	color: #fff;
}

.floor_content .floor_map .row:nth-of-type(1) >div:nth-of-type(1) h4:before{
	content: "1";
}

.floor_content .floor_map .row:nth-of-type(1) >div:nth-of-type(2) h4:before{
	content: "2";
}
.floor_content .floor_map .row:nth-of-type(2) >div:nth-of-type(1) h4:before{
	content: "3";
}

.floor_content .floor_map .row:nth-of-type(2) >div:nth-of-type(2) >div:nth-of-type(1) h4:before{
	content: "4";
}

.floor_content .floor_map .row:nth-of-type(2) >div:nth-of-type(2) >div:nth-of-type(2) h4:before{
	content: "5";
}

.floor_content .floor_map .row:nth-of-type(2) >div:nth-of-type(2) >div:nth-of-type(3) h4:before{
	content: "6";
}

.floor_map > .row > div{
	margin-block: 2rem!important;
}

.floor_map > img{
	max-height: 65vh!important;
	max-width: 600px!important;
	margin-top: 1.5rem!important;
}

.floor_map p{
	text-align: left!important;
	padding-top: 0.5em!important;
	padding-bottom: 1.5em!important;
}

/*.floor_map{
	position: relative;
}

.floor_map > div{
	position: absolute;
	top:0;
	left: 0;
	display: inline-block;
	color: var(--white-color);
	background-color: var(--accent-color);
	border-radius: 50px;
}*/



.floor_office address{
	text-align: left;
	width: max-content;
	margin-left: auto;
	margin-right: auto;
	margin-top: 1rem;
}

.floor_office address div + div{
	margin-top: 1rem;
}

.sub_floor .accordion-body > div{
	margin-top: 1rem!important;
	margin-bottom: 4rem!important;
}

.access_map{
	text-align: center;
}

.access_map iframe {
	width: max(50%,260px);
	aspect-ratio: 4/3; //アスペクト比（縦横比）を指定
}

.access_map > div{
	width: max-content;
}

.access_map p{
	text-align: left;
	line-height: 1.75em;
	margin-top: 0.5rem;
	margin-inline: auto!important;
}

.floor_office > h2{
	position: sticky;
	top: 109px!important;
	z-index: 5;
/*	padding: 1rem 0.5rem 0.5rem!important;*/
}

/*.floor_kitakyushu > h2{
	background-color: var(--bg-light);
}

.floor_kurosaki > h2{
	background-color: var(--bg-dark);
}*/

/*weekly*/

.weekly_precaution ul li{
	margin-left: 1.5em;

}
.weekly_precaution ul li:before{
	content: "・";
	padding-left: 0.5em;
	padding-right: 0.5em;
	margin-left: -1.5em;
}
.sub_weekly .weekly_precaution .weekly_shigomaru {
	padding: 3rem!important;
}
.weekly_shigomaru p{
	text-align: left;
	max-width: 800px;
	display: inline-block;
	margin-inline: center;
}

.button_shigomaru{
	margin-top:1.5rem;
	display: inline-block;
	transition: transform .3s ease;
}

.button_shigomaru:hover{
	transform: scale(0.9);
}

.button_shigomaru > div{
	padding: 1.5rem 5.0rem;
	border: 2px solid var(--main-color)!important;
	width: min(100%, 350px)!important;
	border-radius: 20px!important;
	margin-inline: auto;
	background-color: var(--bg-white);
}

.button_shigomaru > div > img{
	max-width: 100%;
}

@media screen and (max-width:575px){
	.sub_weekly .weekly_precaution .weekly_shigomaru{
		padding: 1.5rem!important;
	}
	.button_shigomaru{
		margin-top: 1rem;
	}
	.button_shigomaru > div{
		padding: 0.75rem 2.5rem;
	}
}


/*event-list*/
.sub_company .sub_anchor,.sub_event-list .sub_anchor{
	margin-top: 2.0rem!important;
}

.sub_event-list section:first-of-type {
    margin-top: 1.5rem!important;
}

/*.sub_event-list section:first-of-type{
	margin-top: -2.5rem!important;
}
*/
/*company*/

.sub_company .white_box{
	color: var(--main-color)!important;
}

.sub_company ol > li + li{
	margin-top: 0.5rem!important;
}

.sub_company section ul,ol{
	margin-left: 1rem!important;
	font-family: var(--ff-normal)!important;
}

.sub_company .button_shigomaru{
	margin-block: 1.5rem;
}

.sub_company .button_shigomaru > div{
	background-color: #388ECC;
	border: none!important;
}

/*お問い合わせ・相談*/

.process_method{
	list-style-type:square;
}

.process_caution{
	margin-top: 0.5rem;
	margin-left: 1rem;
	color: var(--blue-color);
}

.process_caution > li:before{
	content: "※";
	margin-left: -1.5em!important;
	margin-right: 0.5em!important;
}

.inquiry_process{
	margin-top: 1.5rem!important;
}

.inquiry_process button{
	color: var(--blue-color)!important;
	font-weight: 800!important;
}

.inquiry_process .accordion-body{
	color: var(--main-color);
}


.sub_inquiry ol > li > ol{
	list-style-type: none!important;
	margin-left: 0!important;
}

.sub_inquiry ol > li > ol > li{
	position: relative;
	padding-left: 1.5em;
}

.sub_inquiry ol > li > ol > li:before{
	content: "";
	border: 1px solid var(--main-color);
	width: calc(var(--fs-normal) + 0.1em);
	height: calc(var(--fs-normal) + 0.1em);
	border-radius: 50%;
	display: block;
	position: absolute;
	top: 0.85em;
	left: -0.1em;
	z-index: 1;
	color: var(--main-color);
	line-height: var(--fs-normal);
	text-align: center;
	font-size: 0.80rem;
	transform: translateY(-50%);
}

.sub_inquiry ol > li > ol > li:nth-of-type(1):before{
	content: "1";
}

.sub_inquiry ol > li > ol > li:nth-of-type(2):before{
	content: "2";
}
.sub_inquiry ol > li > ol > li:nth-of-type(3):before{
	content: "3";
}

.sub_inquiry section > h3:first-of-type{
	margin-top: 3rem;
}

.sub_inquiry section > div{
	padding-top: 0rem;
	margin-bottom: 3.5rem;
}

/*404*/
.sub_404 section:last-of-type{
	padding-bottom: 0rem!important;
}

.sub_404 .button_submove{
	margin-top: 2rem!important;
}

@media screen and (max-width:1400px) {
	.sub_page .title_box{
		margin-top: -6rem!important;
	}

	.tel_phonenumber{
		font-size: var(--fs-bigger)!important;
	}

	.tel_contact > .row > a > div{
		height: 5rem!important;
	}

	.tel_phonenumber .icon {
		width: 1em!important;
		margin-right: 0.5em!important;
	}

	.office_name{
		margin-top: 0.5rem!important;
	}

	.contact_other .icon {
		width: 1.75rem!important;
		margin-right: 0;
		margin-left: 0;
	}
}

@media screen and (max-width:1199px) {

	#topPage header > .catchcopy{
		font-size: 60pt;
		bottom: calc(50pt + 2.5rem);
		display: inline-block;
	}

	#topPage header > .catchcopy > span + span{
		padding: 0!important;
		margin: 0!important;
		margin-left: -1rem!important;
	}

	#topPage header > .catchcopy:before{
		content: "";
		width: 11em!important;
		display: block;
		position: absolute;
		left: -4rem;
		bottom: 0;
		z-index: -1;
		width: 33em;
	}

	#topPage header > span.catchcopy_small{
		font-size: var(--fs-bigger);
		bottom: 3rem;
	}

	#topPage header > span.catchcopy_small:before{
		content: "";
		display: block;
		position: absolute;
		left: -4rem;
		bottom: 0;
		z-index: -1;
		width: 33em;
	}

	.office_name{
		margin-bottom: 0.25rem!important;
	}

	.tel_phonenumber{
		font-size: var(--fs-big)!important;
	}

	.contact_section a:nth-last-of-type(-n+3) .d-inline-block{
		font-size: var(--fs-normal);
	}

	footer .site_name{
		font-size: var(--fs-small)!important;
	}

	/*.nav-link{
		margin-bottom: 0.85rem;
	}*/

	footer .nav-bar:nth-child(2){
		margin-top: 0.5rem!important;
	}

	footer .footer_logo{
		margin-top: 0.5rem!important;
		width: max(30%,200px);
	}

	footer .logo_name > div > a.navbar-brand{
		display: block!important;
		text-align: center;
	}


	.for_users .nav-link{
		margin-bottom: 0.5rem;
	}

	header .dropdown-menu li:not(:first-child){
		margin-top: 0.5rem;
	}

	#topPage section, .sub_page section, .sub_floor section:not(:first-of-type){
		margin-top: -23rem!important;
	}

	.sub_page section:last-of-type {
		padding-bottom: 2rem!important;
	}


	h2,.movie_title{
		font-size: var(--fs-bigger)!important;
	}

	#topPage footer small{
		padding-bottom: 3.75rem!important;
	}


	.service_title > span{
		font-size: 50pt!important;
		padding-bottom: 0.5rem!important;
		line-height: 50pt!important;
	}

	.service_title {
		margin-left: 0rem!important;
	}

	.service_title:nth-child(2) {
		margin-right: 0rem!important;
	}

	#topPage section.top_service{
		padding-bottom: 12rem!important;
	}

	footer .navbar-nav{
		margin: 0.5rem auto!important;
	}

	footer .navbar-nav .nav-item{
		margin-bottom: 0rem!important;
	}

	footer .for_users{
		margin-bottom: 1.5rem!important;
	}

	footer > div:nth-child(2){
		display: block!important;
		margin-bottom: 1.5rem!important;
		margin-top: 1.5rem!important;
	}

	footer .instagram{

	}

	.sub_top{
		margin-top: 15vh;
		height: 50vh!important;
		position: relative;
		width: 80%;
	}

	.sub_top::after{
		content: "";
		width:calc(75% + 0.6rem);
		height: calc(100% - 0.6rem);
		background: repeating-linear-gradient(-45deg, rgba(255, 255, 255, 1), rgba(255, 255, 255, 1) 1px, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, 0) 6px);
		position: absolute;
		bottom: -0.5rem;
		right: 0rem;
		z-index: -2;
	}

	/*.sub_page h1{
		font-size: 15pt!important;
	}*/

	.sub_page .title_box{
		margin-top: -5rem!important;
		padding-left: 2rem!important;
		padding-right: 1rem!important;
		padding-bottom: 1rem!important;
	}

	.title_eng{
		font-family: var(--ff-italic)!important;
		font-size: var(--fs-small);
		color: var(--accent-color);
	}

	.sub_page h1{
		font-size: var(--fs-biggest);
		font-weight: 700;
	}

	.sub_page .movie_section{
		padding-bottom: 35rem!important;
	}

}


@media screen and (max-width:992px){
		#topPage header{
		height: 415px!important;
	}

	header .first_logo{
		min-width: 100px;
		max-width: 150px;
		left: 0.5rem;
	}

	.js_logo{
		left: 0;
	}

	.header_logo{
		width: 200px!important;
	}

	.header_nav{
		height: auto!important;
	}

	header ul li.for_users{
		flex-direction: column!important;
		align-items: start!important;
		border-top: 1px solid #fff;
		padding-top: 1.0rem!important;
	}

	header ul li.for_users .icon{
		display: none!important;
	}

	header ul li.for_users .white-icon{
		display: block!important;
	}

	header .nav-link{
		margin-bottom: 0.85rem;
	}

		.navbar-collapse{
		background-color: var(--blue-color)!important;
		position: relative;
		z-index: 500;
	}

	.navbar-collapse::after{
	content: "";
	background-color: var(--main-color);
	height: 5px;
	width: 100%;
	position: absolute;
	bottom: 0px;
	left: 0;
	display: block;
	}

	.navbar-brand{
	}

	.navbar-nav{
		width: max-content!important;
		margin: 0.5rem auto!important;
		flex-direction: column-reverse!important;
	}

	header ul li.for_users > a{
		text-align: left!important;
		margin-left: 0;
		justify-content: start!important;
	}

	header ul li > a.nav-link{
		color: var(--white-color)!important;
		padding-left: 1.5rem!important;
		padding-right: 1.5rem!important;
	}

	ul li.for_users{
		text-align: left!important;
		margin-bottom: 1.0rem!important;
	}

	header ul li.nav-item > ul{
		margin-top: 1.25rem!important;
		display: block!important;
	}

	header .dropdown-toggle{
		margin-bottom: 0!important;
	}

	.navbar-toggler{
		border: none!important;
		position: relative;
		height: 60px!important;
	}

	.navbar-toggler-icon{
		background-image:none;
	}

	.navbar-toggler-icon1{
		border-top: 1px solid var(--blue-color);
		top: 1.0rem!important;
		right: 0.5rem!important;
		max-width: 55px!important;
		min-width: 45px!important;
		position: absolute;
		display: block;
		transform-origin:center center;
	}

	.navbar-toggler-icon2{
		display: block;
		position: absolute;
		top:1.75rem;
		right: 0.5rem!important;
		border-bottom: 1px solid var(--blue-color);
		max-width: 55px!important;
		min-width: 45px!important;
	}

	.navbar-toggler-icon3{
		position: absolute;
		display: block;
		top:2.5rem;
		right: 0.5rem!important;
		border-bottom: 1px solid var(--blue-color);
		max-width: 55px!important;
		min-width: 45px!important;
		transform-origin:center center;
	}

	.navbar-toggler{
		box-shadow: none!important;
	}

	.navbar-toggler.click .navbar-toggler-icon{
		box-shadow: none!important;
	}

	.navbar-toggler.click .navbar-toggler-icon1{
		top:1.75rem!important;
		transform:rotate(-30deg);
	}

	.navbar-toggler.click .navbar-toggler-icon3{
		top:1.75rem!important;
		transform:rotate(30deg);
	}

	.navbar-toggler.click .navbar-toggler-icon2{
		opacity: 0;
	}

	#topPage header > .catchcopy{
		font-size: 40pt!important;
		bottom:4rem!important;
	}

	#topPage header > .catchcopy,#topPage header > span{
	transform: rotate(-3deg);
}
	#topPage header > .catchcopy > span + span{
		padding: 0!important;
		margin: 0!important;
		margin-left: -1rem!important;
	}

	#topPage header > .catchcopy:before{
		content: "";
		width: 10.5em;
		left: -4rem;
		bottom: 0;
		z-index: -1;
	}

	#topPage header > span.catchcopy_small{
		font-size: var(--fs-big);
		bottom: 2rem;
	}

	#topPage header > span.catchcopy_small:before{
		content: "";
		width: 34em;
		left: -4rem;
		bottom: 0;
		z-index: -1;
	}

	.fixed_buttons{
	right: 0rem!important;
	width: 100%;
}

	.fixed_buttons > a{
		clip-path: none;
		font-size: 12pt!important;
		font-weight: 500!important;
		width: 50%;
		text-align: center;
		padding:0.7rem 0rem!important;
		transition: 0.2s;
	}

	.fixed_buttons > a + a{
		border-left: 1px solid var(--white-color);
		margin-left: 0!important;
	}

	.fixed_buttons a:hover{
		background-color: var(--bg-hover);
		color: var(--white-color)!important;
	}

	.fixed_buttons img.icon{
		margin-right: 1rem;
	}

	.fixed_text{
		margin-top: 0.2rem!important;
		font-size: var(--fs-big);
	}

	.movie_wrapper{
		margin-top: 2rem!important;
	}

	.movie_wrapper iframe{
		width: 100%;
		height: 100%;
	}

	.footer_contact .contact_info{
		width: 65%;
	}

	.footer_contact .contact_img{
		width: 35%;
	}

	footer small{
		padding: 0.75rem 0.75rem 4.5rem!important;
	}


	.anchor_sp{
	text-align: left!important;
}

	.sub_top{
		width: 90%!important;
	}

	.sub_page .title_box{
		margin-top: -7rem!important;
	}


	.sub_floor .sub_anchor{
		margin-top: 0!important;
		margin-bottom:0!important ;
	}

	.floor_office > h2{
		top: 89px!important;
	}



}

@media screen and (max-width:767px){
	:root{
	/*font-size*/
	--fs-biggest:19pt;
	--fs-bigger:16pt;
	--fs-big:14pt;
	--fs-normal:12pt;
	--fs-small:10pt;
	}

	p,address,li,.article_text{
		font-size: 11pt!important;
	}

	.article_img{
		margin-right: 1rem!important;
	}

	.top_event > div + div {
	    margin-top: 0rem;
	}

	#main_visual > img.mainvisual0{
		object-position: top left;
	}


	#main_visual > img.mainvisual3{
		object-position: top center;
	}

	.more_articles {
		margin-top: 1.5rem!important;
	}

	.tel_contact > .row > a > div {
		height: 4rem!important;
		border-radius: 50px;
	}

	/*.movie_wrapper iframe{
		width: 100%;
	}*/

	#topPage section.top_service{
	padding-bottom: 4rem!important;
}

	footer .navbar-nav{
		flex-direction: column!important;
	}

	footer .navbar-nav .nav-item + .nav-item{
		margin-left: 0!important;
	}

	footer .footer_office{
		display: block!important;
		width: max-content;
		margin-inline: auto;
	}

	footer .footer_office > div + div{
		margin-top: 1rem!important;
		margin-left: 0!important;
	}

	.share_button > div{
	max-width: 200px!important;
}

	.share_button > div img{
		transition: 0.2s;
	}

	.share_button > div img:hover{
		opacity: 0.8;
	}

.share_button > div + div{
	margin-top: 1rem;
}

	.sub_page .title_box{
		margin-top: -4rem!important;
	}

	.sub_top{
		height: 40vh!important;
		width: 100%!important;
	}

	.sub_overview{
	margin-top: 2rem!important;
	margin-bottom: 2rem!important;
	text-align: left;
}

	.sub_page .movie_section{
		padding-bottom: 25rem!important;
	}

	.sub_floor .movie_section {
    margin-top: 3rem!important;
	}

	.office_name{
		margin:0.1rem 0!important;
	}

	.office_img{
		margin-top: 0.5rem!important;
		margin-bottom: 1.5rem!important;
	}

	.office_overview{
		text-align: center;
	}

	.office_overview address{
		text-align: left;
		margin-left: auto;
		margin-right: auto;
		display: inline-block;
	}

	.access_map > div{
	width: auto!important;
}

	.access_map iframe{
	width: 100%!important;
	}


	.sub_company .sub_anchor{
		text-align: center;
		margin-top: 1.5rem!important;
		margin-bottom: 2.5rem!important;
	}

	.sub_weekly .sub_anchor{
		margin-top: 1.5rem!important;
		margin-bottom: 0rem!important;
	}

	.sub_anchor a {
		font-size: var(--fs-small);
		padding-bottom: 0!important;
	}

	.anchor_sp{
		display: flex;
		flex-wrap: wrap!important;
		text-align: left!important;
	}

	.sub_page .title_box{
		min-width: 75%!important;
		max-width: 85%!important;
	}

	.file_button img{
		width: 2.5rem!important;
		margin:0.5rem 0.5rem 0.5rem 1.5rem!important;
	}

	.file_button img.excel_icon{
		width: 2rem!important;
		margin:0.5rem 1rem 0.5rem 1.5rem!important;
	}

	.new_file{
		background-color: var(--caution-color)!important;
		border-radius: 50px;
		color: var(--white-color);
		padding: 0 0.5rem;
		width: max-content;
		font-size: 12px!important;
		margin-bottom: 0.25rem!important;
	}

	.file_title{
		margin:0.5rem 1.5rem 0.5rem 0.5rem!important;
		font-size: var(--fs-small)!important;
	}
}

@media screen and (max-width:630px) and (min-width:601px){
	#topPage header > .catchcopy{
		bottom: 5rem!important;
	}

	#topPage header > .catchcopy > span + span{

	}

	#topPage header > span.catchcopy_small:before {
    content: "";
    width: 25.5em;
    left: -5rem;
    bottom: 1.9rem;
}

	#topPage header > span.catchcopy_small{
		bottom: 1.05rem;
	}

	#topPage header > span.catchcopy_small > span{
		display: block!important;
	}

	#topPage header > span.catchcopy_small > span:before{
		content: "";
		position: absolute;
		background-color: rgba(255, 255, 255, 0.75);
		display: block;
		height: 1.5em;
		left: -4rem;
		bottom:0;
		width: 14em!important;
		z-index: -1;
		line-height: 1em!important;
	}

	#topPage header > .catchcopy > span + span{
		margin-left: -0.75rem!important;
	}
}

@media screen and (max-width:600px){
	header .first_logo{
		min-width: 100px;
		max-width: 130px;
	}

	.service_content{
		margin-top: 50px!important;
	}

	iframe{
		width: 100%;
	}

	section.container,.top_info_box{
		width: calc(100% - 2rem)!important;
	}

	section:nth-child(odd),.sub_page section:nth-of-type(even){
	border:1.5rem solid #fff ;
	border-image: url(../img/bg_even.png) 50 fill round;
}

	#topPage section:nth-child(even),.sub_page section:nth-of-type(odd){
		border:1.5rem solid #fff ;
		border-image: url(../img/bg_odd.png) 50 fill round;
	}


	header .first_logo{
		width: 100px;
	}

	footer .container{
		padding-left: 1.5rem!important;
		padding-right: 1.5rem!important;
	}


	#topPage header > .catchcopy{
		font-size: 28pt!important;
		bottom: calc(12pt + 2.5rem);
		display: inline-block;
	}

	#topPage header > .catchcopy,#topPage header > span{
	left: 0.5rem!important;
}

	#topPage header > .catchcopy > span {
		display: inline-block;
	}

	#topPage header > .catchcopy > span + span{
		padding: 0!important;
		margin: 0!important;
		margin-left: -0.75rem!important;
	}

	#topPage header > .catchcopy:before{
		content: "";
		width: 10.5em;
		display: block;
		position: absolute;
		left: -3rem;
		bottom: 0;
		z-index: -1;
	}

	#topPage header > span.catchcopy_small{
		font-size: 10pt;
		bottom: 2.5rem;
	}

	#topPage header > span.catchcopy_small > span{
		display: inline-block!important;
	}

	#topPage header > span.catchcopy_small:before{
		content: "";
		left: -3rem;
	}

	.fixed_text{
		font-size: var(--fs-normal);
	}

	h2:not(.top_info_title){
		margin-left: -3rem;
		padding-left: 1.5rem!important;
		padding-right: 2.0rem!important;
		margin-bottom: 1rem!important;
	}

	h2:not(.top_info_title):before{
		border-right: 8px solid transparent!important;
		border-bottom: 8px solid var(--main-color)!important;
		border-left: 8px solid transparent!important;
		bottom: -6.5px!important;
		left: 1px!important;
	}

	.top_info{
		margin-bottom: 3rem!important;
	}

	.article_img{
		margin-bottom: 0!important;
		height: 4em;
		margin-right: 0.5rem!important;
	}

	.catLabel{
		padding: 0.35em 0.85em;
		border-radius: 4px;
	}

	.top_office .row + .row{
		margin-top: 2rem!important;
		padding-top: 2rem!important;
	}

	.service_contents > div .service_img{
		height: 40vh!important;
	}

	.service_content:nth-of-type(odd) .service_img{
		margin-left: 1rem!important;
	}

	.service_content:nth-of-type(even) .service_img{
		margin-right: 1rem!important;
	}

	.footer_contact{
		flex-direction: column;
		height: max-content!important;
		position: relative;
	}

	.footer_contact .contact_info{
		width: 100%;
		height: max-content!important;
		position: relative;
		z-index: 3;
	}

	.footer_contact .contact_img{
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}

	.sub_top{
		height: 12rem!important;
	}

		.sub_page .title_box{
			margin-top: -1rem!important;
		}

	.btn > a,.button_submove{
		width: 100%!important;
		font-size: 11pt!important;
		padding-inline: 1rem!important;
	}

	footer .for_users{
		flex-direction: column;
		justify-content: start!important;
		align-items:start!important;
	}

	footer ul li.for_users > a + a{
		margin-left: 0!important;
		margin-top: 0.5rem!important;
	}

	/*.sub_inquiry > div.container:nth-of-type(2){
		padding-left: 0!important;
		padding-right: 0!important;
	}*/

	.contact_info{
		background-color: rgba(76, 112, 159, 0.8);
	}

	/*.inquiry_process{
		margin-inline: 1.5rem!important;
	}*/

}

@media screen and (max-width:430px){
	.header_nav{
		padding-top: 0!important;
	}
	.header_logo{
		width: 180px!important;
	}

	.navbar-toggler-icon{
		margin-top:1rem!important;
	}
	#topPage section.top_service{
		padding-bottom: 0rem!important;
	}

	.service_title > span {
    font-size: 45pt!important;
    padding-bottom: 0.5rem!important;
    line-height: 45pt!important;
}

	section.container{
		padding-inline: 0!important;
	}

	h2:not(.top_info_title) {
    margin-left: -2.25rem;
  }

	.service_title > div {
	    margin-top: 1rem!important;
	    letter-spacing: 0.1rem!important;
	    font-size: var(--fs-big)!important;
	}

	.sub_top {
    margin-top: 6rem!important;
  }

	.sub_page .movie_section{
		padding-bottom: 20rem!important;
	}

	#topPage header > span.catchcopy_small{
		bottom: 1.25rem;
	}

	#topPage header > span.catchcopy_small:before{
		left: -3rem;
		bottom: 1.25rem;
		width: 25em;
	}

	#topPage header > span.catchcopy_small > span{
		display: block!important;
	}

	#topPage header > span.catchcopy_small > span:before{
		content: "";
		position: absolute;
		background-color: rgba(255, 255, 255, 0.75);
		display: block;
		height: 1.5em;
		left: -3rem;
		bottom:-0.05rem;
		width: 13em!important;
		z-index: -1;
		line-height: 1em!important;
	}

	.floor_map > .row > div {
	    margin-block: 1rem!important;
	}

	.floor_map p{
		padding-bottom: 1rem!important;
	}

}

@media screen and (max-width:380px){
	.sub_page .title_box{
		margin-top: -3rem!important;
	}
}

@media screen and (max-width:350px){
}

@media screen and (min-width:430px){

}

@media (min-width: 1200px){
	.container{
		max-width: 1200px!important;
	}

	.contact_section a:nth-of-type(-n+2){
		pointer-events: none;
	}

}


@media screen and (max-width:1200px) and (orientation: landscape){
	.sub_top{
			height: 30rem!important;
	}
}

@media screen and (max-width:767px) and (orientation: landscape){
	.sub_page .title_box{
		margin-top: -10rem!important;
	}
}

@media screen and (max-width:600px) and (orientation: landscape){


	.sub_page .title_box{
		margin-top: -14rem!important;
	}
}


@media only screen and (min-width: 768px) and (min-height: 1024px) and (orientation:portrait) {
	.sub_top{
		margin-top: 7rem!important;
	}
	.sub_page .title_box{
		margin-top: -16rem!important;
	}
}

@media only screen and (min-width: 768px) and (min-height: 1200px) and (orientation:portrait) {
	.sub_page .title_box{
		margin-top: -22rem!important;
	}
}