@charset "UTF-8";
/*
Theme Name: 登録センター神戸
Author: 株式会社メックコミュニケーションズ
Author URI: https://www.mec-com.co.jp
Date: 2025-05
*/

/*parts
-----------------------------------------------------------------------------------------*/
body{
/*特色*/
	--color_mizu:#eef8fd;/*水色*/
	--color_sora:#d4eef9;/*空色*/
	--color_ao:#486bbf;/*青*/
	--color_kon:#36508f;/*紺色*/
	--color_mido:#49bf60;/*緑色*/
	--color_kimi:#d8e380;/*黄緑色*/
	--color_cha:#d2c1ad;/*茶色*/
	--color_aka:#FF0000;/*赤*/
/*em*/
	--color_notice:var(--color_aka);
/*リンク青*/
	--color_link:#3c77ff;
/*tx_bar*/
	--tx_bar:var(--color_ao);
/*tx_line*/
	--tx_line:var(--color_ao);
/*tx_maru*/
	--tx_maru:var(--color_ao);
/*ya*/
	--ya_tri:var(--color_ao);
	--ya_sen:var(--color_ao);
	--ya_maru:var(--color_ao);
/*list*/
	--list_line:#000;
	--list_box:#FFF;
	--list_mark:var(--color_red);
/*sitemap*/
	--sitemap:var(--color_ao);
	--sitemap_ya:var(--color_ao);
/*parts*/
	--dtbox_tx:#FFF;
	--dtbox_bg:var(--color_ao);
	--tab_btn:var(--color_ao);
/*btn*/
	--btn:var(--color_ao);
/*etc*/
	--sya:var(--color_ao);
}
/*-------------------------base*/
.btn,
.tx_kiji,
.tx_belt,
.tx_line,
.tx_line_dash,
.tx_bold{
	font-family: "Zen Maru Gothic",serif;
}
/*tx*/
	.tx p{
	line-height:1.88;
	}
	.tx a{
	color:var(--color_kon);
	}
/*tx_waku*/
	.tx_waku{
	border:1px solid var(--color_ao);
	}
/*tx_kiji*/
	.tx_kiji{
	color:var(--color_kon);
	font-size:3rem;
	border-top:1.5px dashed var(--color_ao);
	border-bottom:1px solid var(--color_ao);
	}
	@media screen and (max-width: 767px) {.tx_kiji{font-size:2.4rem;}}
/*tx_belt*/
	.tx_belt{
	background:var(--color_sora);
	font-size:2rem;
	color:var(--color_kon);
	}
	@media screen and (max-width: 767px) {.tx_belt{font-size:2rem;}}
/*tx_line*/
	.tx_line{
	color:var(--color_kon);
	font-size:3rem;
	border-bottom:1.5px solid var(--color_ao);
	padding-bottom:0.5em;
	}
	@media screen and (max-width: 767px) {.tx_line{font-size:2.2rem;}}
/*tx_line_dash*/
	.tx_line_dash{
	border-bottom:1.5px dashed var(--color_ao);
	font-size:3.4rem;
	line-height:1.3;
	color:var(--color_kon);
	padding-bottom:0.5em;
	margin-bottom:0.5em;
	position:relative;
	}
	.tx_line_dash .no{
	font-size:200%;
	width:1.4em;
	line-height:1;
	margin-top:-0.25em;
	letter-spacing:0.1em;
	font-weight:bold;
	color:var(--color_ao);
	}
	.tx_line_dash .no.question{
	width:1.6em;
	}
	@media screen and (max-width: 767px) {.tx_line_dash{font-size:2.2rem;}}
/*btn*/
	.btn{
	background:#FFF;
	}
/*tx_bold*/
	.tx_bold{
	font-size:2.8rem;
	font-weight:bold;
	color:var(--color_kon);
	margin-bottom:0.3em;
	}
	@media screen and (max-width: 767px) {.tx_bold{font-size:2.2rem;}}
/*hv_link*/
	.hv_link:hover{
	text-decoration:underline;
	color:var(--color_link);
	}
/*hv_btn*/
	.hv_btn a:hover{
	filter: brightness(110%) saturate(150%);
	}
/*list_line*/
	.list_line{
	border-bottom:1.5px dashed var(--color_ao);
	}
	.list_line a{
	background:none;
	color:#000;
	}
	.list_line a:hover{
	filter:brightness(100%);
	background:rgba(255,255,255,0.8);
	}
	.list_line .list_date{
	font-weight:bold;
	}
	.list_line .list_cat{
	background:var(--color_ao);
	color:#FFF;
	width:8em;
	margin-bottom:auto;
	text-align:center;
	border-radius:5px;
	font-weight:bold;
	font-size:1.4rem;
	line-height:2.7rem;
	flex-shrink:0;
}
@media screen and (max-width: 767px) {
.list_line a{padding:1em 0;gap:0.4em 0.8em;}
.list_line .list_date{font-size:1.4rem;}
.list_line .list_cat{font-size:1.2rem;line-height:2.2rem;}
.list_line .list_title{width:100%;}
}
/*tx_fuki*/
	body .tx_fuki,
	body .tx_fuki.rad100{
	position:relative;
	overflow:visible;
	line-height:1.25;
	}
	.tx_fuki::after{
	content:"";
	display:block;
	background:var(--color_ao);
	height: calc(tan(60deg) * 24px / 2);
	width: 24px;
	clip-path: polygon(0 0, 100% 0, 50% 100%);
	position:absolute;
	bottom:-20px;
	}
	@media screen and (max-width: 767px) {
	.tx_fuki::after{bottom:-15px;}
	}

/*imgbox
-----------------------------------------------------------------------------------------*/
.imgbox{
	display:flex;
	justify-content:space-between;
	align-items:top;
	position:relative;
	gap:20px 40px;
}
.imgbox div{
	width:560px;
	max-width:100%;
}
.imgbox figure{
	width:400px;
	border-radius:20px;
	overflow:hidden;
	max-width:100%;
	margin-top:0.4em;
}
@media screen and (max-width: 767px) {
	.imgbox.reverse,
	.imgbox{flex-direction:column;}
	.imgbox div{min-width:100%;}
	.imgbox figure{margin-left:auto;margin-right:auto;}
}

/*pagejump
-----------------------------------------------------------------------------------------*/
.pagejump ul{
	gap:5%;
}
.pagejump ul li{
	width:420px;
	max-width:100%;
}
.pagejump ul li a{
	display:flex;
}
.pagejump ul li p{
	width:100%;
	min-height:85px;
	border-radius:100px;
	transition:all 0.3s;
}
.pagejump .img{
	width:180px;
}
.pagejump .abs{
	right:20px;
	bottom:-15px;
	transition:all 0.3s;
}
.pagejump ul li a:hover p{
	background-color:var(--color_ao);
	color:#FFF;
}
.pagejump ul li a:hover .abs{
	transform: rotate(-90deg);
}
@media screen and (max-width: 950px) {
	.pagejump ul{gap:20px;}
	.pagejump .abs{right:0;bottom:-15px;width:40px}
}
@media screen and (max-width: 767px) {
	.pagejump .img{width:120px;position:relative;z-index:1;}
	.pagejump ul li p{padding:15px 5px;border-radius:20px;margin-top:-30px;}
	.pagejump ul li p .fsp80{font-size:70%;}
	.pagejump .abs{right:0;bottom:-20px;width:40px}
}

/*home
-----------------------------------------------------------------------------------------*/
main.home{
	padding-bottom:0;
}
/*-------------------------mainimg*/
.mainimg{
	position:relative;
	width:100%;
	display:flex;
	justify-content:end;
}
/*slider*/
.slider{
	max-width:100%;
}
/*max-width:calc(50% + 640px);
@media screen and (max-width: 1300px) {.slider{max-width:100%;}}*/
.slider .slide{
	height:650px;
}
.slider .slide{
	position:relative;
	padding-left:150px;
}
.slider .slide span{
	display:block;
	height:100%;
	overflow:hidden;
}
.slider .slide span img{
  object-fit: cover;
  width: 100%;
  height: 100%;
  object-position:center;
}
.slider .slide > img{ 
	position:absolute;
	left:90px;
	bottom:30px;
} 
@media print, screen and (min-width: 1000px) {
	.slider .slide span{border-bottom-left-radius:40px;}
}
@media screen and (max-width: 1300px) {
	.slider .slide{height:50vw;padding-left:90px;}
	.slider .slide > img{width:40vw;left:30px;}
}
@media screen and (max-width: 999px) {
	.slider .slide{height:530px;padding-left:0;}
	.slider .slide > img{bottom:10px;min-width:350px;}
}
@media screen and (max-width: 440px) {
	.slider .slide > img{bottom:10px;min-width:84vw;left:8vw;}
}
/*slick-dots*/
.slick-dots{
	margin:10px 20px;
	display:flex;
	gap:10px;
	justify-content:end;
}
.slick-dots button{
	border:none;
	text-indent:-9999em;
	cursor:pointer;
	border-radius:10px;
	width:10px;
	height:10px;
	background:#CCC;
}
.slick-active button{
	background:var(--color_ao);
}
@media screen and (max-width: 767px) {
	.slick-dots{justify-content:center;}
}
/*-------------------------home_about*/
@media print, screen and (min-width: 768px) {
.home_about div{
	max-width:820px;
	margin-left:auto;
	position:relative;
	z-index:11;
}
.home_about{
	padding-left:200px;
}
.home_about .tori{
	left:calc(50% + 200px);
}
}
@media screen and (max-width: 767px) {
.home_about .tori{
	width:62px;
	left:auto;
	right:50px;
	top:-15px;
}
}
/*-------------------------home_topics*/
@media print, screen and (min-width: 768px) {
.home_topics{
	background-image:url(images/bg_home_topics.svg);
	background-repeat:no-repeat;
	background-position:calc(50% - 400px) top;
}
@media screen and (max-width: 1000px) {.home_topics{background-position:-100px top;}}
}
.home_topics .frame{
	min-height:350px;
	padding:0 20px;
	max-width:900px;
}
.home_topics .tab_btn{
	height:60px;
	width:170px;
	padding:10px;
	display:flex;
	justify-content:center;
	align-items:center;
	color:var(--color_kon);
	font-weight:bold;
	border:1px solid var(--color_ao);
	background:#FFF;
	border-radius:30px;
	position:relative;
}
.home_topics .tab_btn::after{
	content:"";
	display:block;
	background:var(--color_ao);
	height: calc(tan(60deg) * 20px / 2);
	width: 20px;
	clip-path: polygon(0 0, 100% 0, 50% 100%);
	position:absolute;
	bottom:0;
	z-index:-1;
}
.home_topics .tab_btn:hover,
.home_topics .tab_btn.open{
	color:#FFF;
	background:var(--color_ao);
}
.home_topics .tab_btn:hover::after,
.home_topics .tab_btn.open::after{
	z-index:0;
	bottom:-15px;
	transition:all 0.3s;
}
@media screen and (max-width: 767px) {
	.home_topics .tab_btn{width:auto;height:auto;font-size:1.4rem;}
	.home_topics .tab_btn:hover::after,
	.home_topics .tab_btn.open::after{bottom:-10px;}
}
.home_topics .tori{
	padding-right:calc(50vw - 550px);
	margin-right:10px;
}
/*-------------------------home_access*/
@media print, screen and (min-width: 768px) {
.home_access{
	background-image:url(images/bg_home_access.svg);
	background-repeat:no-repeat;
	background-position:center;
}
@media screen and (max-width: 1200px) {.home_access{background-size:120%;}}
}
.home_access .office{
	padding:min(4vw , 40px);
	gap:min(4vw , 50px);
	position:relative;
	z-index:11;
}
@media screen and (max-width: 600px) {
	.home_access .office{flex-direction:column;align-items:center;padding:25px;gap:20px;}
	.home_access .office .sen_t{width:100%}
}
/*-------------------------home_entry*/
@media print, screen and (min-width: 768px) {
.home_entry{
	background-image:url(images/bg_home_entry.svg);
	background-repeat:no-repeat;
	background-position:top center;
}
@media screen and (max-width: 1200px) {.home_entry{background-size:120%;}}
}
/*-------------------------home_ban*/
.home_ban img{
	max-height:95px;
	width:auto;
}
/*-------------------------hr*/
.home hr{height:100px;margin-top:-100px;position:relative;margin-bottom:-1px;}
.home .hr1{
	background:url(images/hr1.svg) center no-repeat;
	background-size:cover;
}
.home .hr2{
	background:url(images/hr2.svg) center no-repeat;
	background-size:cover;
}
.home .hr3{
	background:url(images/hr3.svg) center no-repeat;
	background-size:cover;
	height:150px;margin-top:-150px;
}
.home .hr4{
	background:url(images/hr4.svg) center no-repeat;
	background-size:cover;
}
@media screen and (max-width: 767px) {
.home hr{height:10vw;margin-top:-10vw;}
.home .hr3{height:15vw;margin-top:-15vw;}
}
@media screen and (max-width: 500px) {
.home hr{height:50px;margin-top:-50px;}
.home .hr3{height:100px;margin-top:-100px;}
}
/*-------------------------------------------------------------------------------------------------特色border_color*/
body .sen_mizu{border-color:var(--color_mizu);}
body .sen_sora{border-color:var(--color_sora);}
body .sen_ao{border-color:var(--color_ao);}
body .sen_kon{border-color:var(--color_kon);}
body .sen_mido{border-color:var(--color_mido);}
body .sen_kimi{border-color:var(--color_kimi);}
body .sen_cha{border-color:var(--color_cha);}
body .sen_aka{border-color:var(--color_aka);}
/*-------------------------------------------------------------------------------------------------特色bg*/
body .bg_mizu{background-color:var(--color_mizu);}
body .bg_sora{background-color:var(--color_sora);}
body .bg_ao{background-color:var(--color_ao);}
body .bg_kon{background-color:var(--color_kon);}
body .bg_mido{background-color:var(--color_mido);}
body .bg_kimi{background-color:var(--color_kimi);}
body .bg_cha{background-color:var(--color_cha);}
body .bg_aka{background-color:var(--color_aka);}
/*-------------------------------------------------------------------------------------------------特色text_color*/
body .tx_mizu{color:var(--color_mizu);}
body .tx_sora{color:var(--color_sora);}
body .tx_ao{color:var(--color_ao);}
body .tx_kon{color:var(--color_kon);}
body .tx_mido{color:var(--color_mido);}
body .tx_kimi{color:var(--color_kimi);}
body .tx_cha{color:var(--color_cha);}
body .tx_aka{color:var(--color_aka);}
body .tx_link{color:var(--color_link);}
/*-------------------------------------------------------------------------------------------------特色ya*/
body .ya_ao::before{border-color:var(--color_ao);background-color:var(--color_ao);}
body .ya_ki::before{border-color:#fbb03b;background-color:#fbb03b;}
body .ya_aka::before{border-color:var(--color_aka);background-color:var(--color_aka);}
/*-------------------------------------------------------------------------------------------------utility*/
body .tx_m{font-family: "Zen Maru Gothic",serif;}
.dot_maru li:before{transform: scale(0.8) translateY(0.15em);}
.dot_ao li:before{background:var(--color_ao);}
.dot_aka li:before{background:var(--color_aka);}
.mw1000{max-width:1000px;margin-left:auto;margin-right:auto;}
.mw900{max-width:900px;margin-left:auto;margin-right:auto;}
.pb150{padding-bottom:150px;}
.abs_c{position:absolute;top:0;width:100%;text-align:center;}
.lm{display:inline;background:linear-gradient(transparent 50%, #fcee21 50%)}
@media print, screen and (min-width: 768px) {
.pc_px150{padding-left:150px;padding-right:150px;}
}
body .sen_t_dash{border-top:1.5px dashed var(--color_ao);}
body .sen_b_dash{border-bottom:1.5px dashed var(--color_ao);}
.of-c{
	  width: 100%;
	  height: 100%;
	  object-fit:cover;
}
.of-c.right{
	  object-position:right;
}
