@charset "UTF-8";
/*
Author: 株式会社メックコミュニケーションズ
Author URI: https://www.mec-com.co.jp
Last Up Date: 2026-02
*/


/*  CSS Index
--------------------------------------------------------------
ヘッダーのロゴは縦の長さで横幅を自動調整します。
比率に注意してください。
--------------------------------------------------------------
@media print, screen and (min-width: 768px) {pc/print}
@media screen and (max-width: 767px) {sp}
1 : base
 	  : body
 	  : frame
 	  : clearfix
 	  : accordion
 	  : pc/sp
 	  : print
2 : header
 	  : header_logo
 	  : header_title
 	  : header_logout
3 : main
 	  : list_topics
 	  : single
4 : footer
 	  : pagetop
 	  : copyright
5 : print
6 : kagi_login
***customize***
-----------------------------------------------------------------------------------------*/


/*base
-----------------------------------------------------------------------------------------*/
*{
	margin: 0; 
	padding: 0; 
	list-style-type: none; 
	font-weight: normal;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
html{
	height:100%;
	font-size:10px;
}
body{
	font-family: 'Inter', "Zen Kaku Gothic New", sans-serif;
	color:#000;
	text-align:center;
	font-size:1.8rem;
	line-height:1.5;
	height:100%;
	min-width:375px;
	-webkit-text-size-adjust: 100%;
	overflow-wrap: break-word;
	word-wrap: break-word
	background:#FFF;
	overflow-x: hidden;
    overflow-x: clip;
}
body * {
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   box-sizing: border-box;
}
ruby{
	ruby-position:under; 
}
ruby rt{
	margin:5px 0;
	letter-spacing:1px;
}
img{
	border-width: 0px;
	vertical-align: bottom;
	max-width: 100%;
	height: auto;
	width /***/:auto;
}
* html img{
	border-width: 0px;
	vertical-align: top;
	padding:-1px;
}
*:first-child+html img {
	border-width: 0px;
	vertical-align: middle;
	padding:-1px;
}
h1,h2,h3,h4,h5,h6,p,ul,dl,input,table,figure,ol,.dot{
	font-size:1.8rem;
	line-height:1.5;
	margin:0;
}
h1,h2,h3,h4,h5,h6{
	font-weight:medium;
	font-family: "Zen Maru Gothic",serif;
}
/*日時など*/
time{
	font-family: 'Noto Sans JP', sans-serif;
	font-weight:600;
}
@media screen and (max-width: 767px) {h1,h2,h3,h4,h5,h6,p,ul,dl,input,table,figure,ol,.dot{font-size:1.6rem;}}
ul > li,
dl > dt,
dl > dd{
	font-size:inherit
}
span{
	font-weight:inherit;
	display:inline-block;
	text-decoration:inherit;
}
em{
	font-style:inherit;
	font-size:105%;
	font-weight:medium;
	font-family: "Zen Maru Gothic",serif;
	color:var(--color_aka);
}
strong{
	font-weight:bold;
}
a{
	color:inherit;
	font-weight:inherit;
	text-decoration: none;
	outline:none;
	-webkit-text-decoration-skip: none;
}
a:hover {
	text-decoration: none;
	outline:none;
}
a:link,a:visited,a:hover,a:active {
	outline:none;
}
hr{
	border:none;
	border-top:1px solid rgba(0,0,0,0.2);
	margin:70px 0;
}
@media screen and (max-width: 767px) {hr{margin:30px 0;}}
/*-------------------------wrapper*/
#wrapper{
	width:100%;
	min-height:100vh;
	display:flex;
	flex-direction:column;
	--hh:80px;
	padding-top:var(--hh);
}
@media screen and (max-width: 1000px) {
	#wrapper{--hh:60px;}
}
/*-------------------------frame*/
.frame{
	max-width:1200px;
	margin:0 auto;
	text-align:left;
	position:relative;
	padding:0 60px;
}
@media screen and (max-width: 1300px) {
	.frame{padding:0 40px;}
}
@media screen and (max-width: 767px) {
	.frame{padding:0 20px;}
}
/*-------------------------clearfix*/
.clearfix::after{
	display: block;
	clear: both;
	content: "";
}
/*-------------------------accordion*/
.accordion{
	display:none;
}
.accordion.open{
	display:block;
}
.acc_btn{
	cursor:pointer;
}
/*-------------------------pc/sp*/
@media screen and (max-width: 767px) {#wrapper .pc{display:none;}}
@media print, screen and (min-width: 768px) {#wrapper .sp{display:none;}}
/*-------------------------scrollbarを隠す*/
.globalnav{
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.globalnav::-webkit-scrollbar{
  display:none;
}



/*header
-----------------------------------------------------------------------------------------*/
.header{
	z-index:1000;
	width:100%;
	display:flex;
	align-items:center;
	justify-content:center;
	max-width:100%;
	min-width:375px;
	height:var(--hh);
	background:var(--color_state4);
	overflow:hidden;
	position:fixed;
	top:0;
}
/*-------------------------header_title*/
.header_title{
	font-size:3.5rem;
	letter-spacing:0.1em;
	margin-bottom:0.1em;
}
.header_title::first-letter{
	color:var(--color_state);
}
@media screen and (max-width: 1000px) {
	.header_title{font-size:2.2rem;}
}
/*-------------------------header_logout*/
.header_logout{
	position:absolute;
	right:10px;
}
.header_logout a{
	padding:0 1em;
	display:flex;
	justify-content:center;
	align-items:center;
	gap:0.2em;
	height:40px;
	border-radius:20px;
	font-size:1.6rem;
	background:var(--color_state);
	color:#FFF;
}
.header_logout span{
	display:none;
}
.header_logout a:hover{
	background:#555;
}
@media screen and (max-width: 1000px) {
	.header_logout strong{display:none;}
	.header_logout span{display:block;}
	.header_logout a{padding:0 0 0 3px;width:40px;}
}
/*-------------------------header_prev*/
.header_prev{
	position:absolute;
	left:0;
}
.header_prev a{
	font-weight:bold;
	padding:0 1em;
	display:flex;
	align-items:center;
	font-size:1.8rem;
	height:40px;
	border-top-right-radius:20px;
	border-bottom-right-radius:20px;
}
.header_prev a:hover{
	background:#FFF;
}
.header_prev a::before{
	content:"";
	display:block;
	width:1em;
	height:1em;
	border-top:0.15em solid #000;
	border-left:0.15em solid #000;
	transform:rotate(-45deg);
}
@media screen and (max-width: 1000px) {
	.header_prev a{font-size:1.4rem;}
}



/*main
-----------------------------------------------------------------------------------------*/
main{
	display:block;
    animation-name: fadein;
    animation-duration: 0.5s;
}
main a{
	transition: all 0.2s;
}
/*--------------------------------------------------list_topics*/
.list_topics{
}
.list_topics .list_line{
	border-top:none;
	border-bottom:1px dashed #B5B5B5;
}
.list_topics a{
	padding:1.3em 0.3em;
	gap:0.8em;
}
.list_topics .list_date{
	letter-spacing:0.05em;
}
.list_topics .list_cat{
	margin-top:0.1em;
	padding:0.1em;
	font-size:75%;
	border-radius:100px;
	border:1px solid var(--color_state);
	color:var(--color_state);
	font-weight:600;
}
@media screen and (max-width: 1000px) {
	.list_line a{flex-wrap:wrap;gap:0.2em 0.6em;padding:1em 0;}
	.list_line p{width:100%;}
}
/*--------------------------------------------------single*/
.single{
	position:relative;
	margin:10px 0;
}
@media print, screen and (min-width: 768px) {
	.single{border:1px solid #BDBDBD;padding:40px 50px;}
}
/*-------------------------single_data*/
.single_data{
	font-size:1.6rem;
	display:flex;
	align-items:center;
	gap:1em;
	margin-top:0.5em;
}
.single_data time{
	font-weight:bold;
}
.single_data span{
	text-align:center;
	padding:0 1em 0.1em 1em;
	border-radius:100px;
	border:1px solid var(--color_state);
	color:var(--color_state);
	font-weight:600;
}
/*-------------------------single_title*/
.single_title{
	font-size:2.6rem;
	color:#000;
	padding:0.75em 0;
	border-bottom:1px dashed #BDBDBD;
	margin-bottom:1.5em
}
/*-------------------------single_kiji*/
.single_kiji p{
	margin-bottom:0.5em;
}
/*見出し1*/
.single_kiji h2{
	font-weight:600;
	background:var(--color_state);
	color:#FFF;
	padding:0.2em 0.5em;
	margin-top:1.5em;
	margin-bottom:0.5em;
}
/*見出し2*/
.single_kiji h3{
	font-weight:600;
	font-size:2rem;
	color:var(--color_state);
	margin-top:1.5em;
	margin-bottom:0.5em;
}
/*見出し3*/
.single_kiji h4{
	font-weight:600;
	margin-top:1.5em;
	border-bottom:1px solid #BDBDBD;
	padding-bottom:0.3em;
	margin-bottom:0.5em;
}
.single_kiji h5{
	font-size:1.5rem;
	margin-bottom:0.5em;
}
/*番号なしリスト*/
.single_kiji ul{
	margin-bottom:0.5em;
}
.single_kiji ul li{
	font-size:inherit;
	margin-left:1em;
}
.single_kiji ul li:before{ 
	margin-left:-1em;
	display:inline-block; 
	content:'';
	width:1em;
	height:1em;
	background:rgba(0,0,0,1);
	border-radius:50%;
	transform:scale(0.5) translateY(0.4em);
}
.single_kiji ul > li + li{margin-top:0.25em;}



/*footer
-----------------------------------------------------------------------------------------*/
.footer{
	position:relative;
	margin-top:auto;
}
/*-------------------------pagetop*/
.pagetop a{
	position:fixed;
	bottom:10px;
	right: 10px;
	width:70px;
	height:70px;
	padding-top:25px;
	z-index:20;
	background:rgba(255,255,255,0.8);
	border-radius:100%;
	box-shadow: 0 0 5px #00000020;
	transition:all 0.3s;
	line-height:1;
}
.pagetop.bottom a{
	bottom:60px;
}
.pagetop a:hover{
	padding-top:10px;
	background:var(--color_state4);
}
@media screen and (max-width: 1000px) {
	.pagetop a{width:40px;height:40px;padding:9px 12px;}
}
/*-------------------------copyright*/
.copyright{
	display:block;
	line-height:50px;
	background:var(--color_state2);
	font-family:serif;
}
.copyright a:hover{
	text-decoration:underline;
}
/*print
-----------------------------------------------------------------------------------------*/
@media print{
	#wrapper header,
	#wrapper footer,
	#wrapper .topicstitle{display:none;}
	body{min-width:1200px;}
}


/*kagi_login
-----------------------------------------------------------------------------------------*/
.kagi_login{
	min-height:calc(100vh - 50px);
	padding:20px;
	text-align:center;
	background:var(--color_state4);
}
@media print, screen and (min-height: 850px) {
.kagi_login{padding-top:100px;}
}
/*-------------------------kagi_login_logo*/
@media screen and (max-width: 1000px) {
	.kagi_login_logo img{width:200px;}
}
/*-------------------------kagi_login_title*/
.kagi_login_title{
	font-size:3.5rem;
	letter-spacing:0.1em;
	margin-top:0.1em;
}
.kagi_login_title::first-letter{
	color:var(--color_state);
}
@media screen and (max-width: 1000px) {
	.kagi_login_title{font-size:2.4rem;}
}
/*-------------------------kagi_login_notice*/
.kagi_login_frame{
	margin:15px auto;
	text-align:left;
	padding:20px 30px;
	max-width:400px;
	background:#FFF;
	border: 1px solid #ccc;
	border-radius: 8px;
}
.kagi_login label input{
	font-size:18px;
	width:100%;
	height:40px;
	border-radius:5px;
	border: 1px solid #666;
	padding:0 5px;
}
.kagi_login input[type="submit"]{
	background-color:var(--color_state);
	color:#FFF;
	padding:10px 20px;
	border: none;
	border-radius:5px;
	cursor:pointer;
	font-weight: bold;
}
.kagi_login input[type="submit"]:hover {
	background-color:var(--color_state2);
}


/*----------------------------------------------------------------------------------------
customize
----------------------------------------------------------------------------------------*/

/*parts
-----------------------------------------------------------------------------------------*/
body{
/*特色*/
	--color_mido:#00aabc;
	--color_mido2:#58c2cf;
	--color_mido3:#73D0DA;
	--color_mido4:#E9F7F9;
	--color_ao:#1a61b0;
	--color_cha:#998675;
	--color_rose:#e24f76;
	--color_rose2:#EB95AD;
	--color_rose3:#ffe8e8;
	--color_rose4:#fff3f3;
	--color_hai:#f9f9fa;
	--color_aka:#DF354A;
/*リンクの色*/
	--color_link:#0071bc;
/*-------------------------base*/
/*text*/
	--tx_sen:var(--color_rose);
	--tx_waku:var(--color_rose2);
	--tx_kiji:var(--color_rose);
	--tx_belt:var(--color_rose);
	--tx_line:var(--color_rose2);
	--tx_bar:var(--color_rose);
	--tx_maru:var(--color_link);
/*ya*/
	--ya_tri:var(--color_link);
	--ya_sen:var(--color_rose);
	--ya_maru:var(--color_rose);
/*list*/
	--list_line:#000;
	--list_box:#FFF;
	--list_mark:red;
/*sitemap*/
	--sitemap:var(--color_rose);
	--sitemap_ya:var(--color_rose);
/*parts*/
	--flow_no:#CCCCCC;
	--dtbox:#CCCCCC;
	--tab_btn:var(--color_rose);
/*etc*/
	--sya:var(--color_rose);
}
.stdnt{
	--color_state:var(--color_rose);
	--color_state2:var(--color_rose2);
	--color_state3:var(--color_rose3);
	--color_state4:var(--color_rose4);
	--btn:var(--color_rose);
}
.grad{
	--color_state:var(--color_mido);
	--color_state2:var(--color_mido2);
	--color_state3:var(--color_mido3);
	--color_state4:var(--color_mido4);
	--btn:var(--color_mido);
}
/*-------------------------------------------------------------------------------------------------parts*/
/*--------------------------------------------------table*/
table th,
table td{
	border:1px solid var(--color_rose2);
	font-weight:400;
	font-family: 'Inter', "Zen Kaku Gothic New", sans-serif;
	padding:1em;
}
table th{
	background-color:#f9dce4;
	font-weight:500;
	font-family: 'Inter', "Zen Maru Gothic", sans-serif;
}
table td{
	vertical-align:top;
}
@media screen and (max-width: 767px) {
	table th,
	table td{padding:0.5em;}
}
/*--------------------------------------------------tx*/
.tx a,
.tx_medi{
	font-weight:medium;
	font-family: "Zen Maru Gothic",serif;
}
.tx_line{
	margin-top:70px;
	border-bottom:1px solid var(--color_rose2);
	padding:0 0 13px 30px;
	background:url(images/tx_line.svg) left top no-repeat;
	background-size:20px calc(100% - 10px);
	margin-bottom:0.75em;
}
@media screen and (max-width: 1000px) {
	.tx_line{margin-top:50px;}
}
/*-------------------------------------------------------------------------------------------------特色border_color*/
body .sen_mido{border-color:var(--color_mido);}
body .sen_mido2{border-color:var(--color_mido2);}
body .sen_mido3{border-color:var(--color_mido3);}
body .sen_ao{border-color:var(--color_ao);}
body .sen_cha{border-color:var(--color_cha);}
body .sen_rose{border-color:var(--color_rose);}
body .sen_rose2{border-color:var(--color_rose2);}
body .sen_link{border-color:var(--color_link);}
body .sen_aka{border-color:var(--color_aka);}
/*-------------------------------------------------------------------------------------------------特色bg*/
body .bg_mido{background-color:var(--color_mido);}
body .bg_mido2{background-color:var(--color_mido2);}
body .bg_mido3{background-color:var(--color_mido3);}
body .bg_mido4{background-color:var(--color_mido4);}
body .bg_ao{background-color:var(--color_ao);}
body .bg_cha{background-color:var(--color_cha);}
body .bg_rose{background-color:var(--color_rose);}
body .bg_rose2{background-color:var(--color_rose2);}
body .bg_rose3{background-color:var(--color_rose3);}
body .bg_rose4{background-color:var(--color_rose4);}
body .bg_hai{background-color:var(--color_hai);}
body .bg_link{background-color:var(--color_link);}
body .bg_aka{background-color:var(--color_aka);}
/*-------------------------------------------------------------------------------------------------特色text_color*/
body .tx_mido{color:var(--color_mido);}
body .tx_mido2{color:var(--color_mido2);}
body .tx_ao{color:var(--color_ao);}
body .tx_cha{color:var(--color_cha);}
body .tx_rose{color:var(--color_rose);}
body .tx_rose2{color:var(--color_rose2);}
body .tx_hai{color:var(--color_hai);}
body .tx_link{color:var(--color_link);}
body .tx_aka{color:var(--color_aka);}
/*-------------------------------------------------------------------------------------------------特色ya*/
body .ya_mido::before{border-color:var(--color_mido);background-color:var(--color_mido);}
body .ya_ao::before{border-color:var(--color_ao);background-color:var(--color_ao);}
body .ya_cha::before{border-color:var(--color_cha);background-color:var(--color_cha);}
body .ya_rose::before{border-color:var(--color_rose);background-color:var(--color_rose);}
body .ya_hai::before{border-color:var(--color_hai);background-color:var(--color_hai);}
body .ya_link::before{border-color:var(--color_link);background-color:var(--color_link);}
body .ya_aka::before{border-color:var(--color_aka);background-color:var(--color_aka);}
/*-------------------------------------------------------------------------------------------------utility*/