@charset "utf-8";
/* CSS Document */
body.no-scroll { overflow: hidden; }
@media screen and (max-width: 1200px) {
	header { width: auto; }
}
@media screen and (max-width: 800px){
	header { padding: 0 20px; }
	header #global_nav { position: relative; }
	header #global_navi #menu_icon {
		display: inline-block;
		position: fixed;
		top: 20px;
		right: 20px;
		width: 40px;
		height: 40px;
		padding: 10px 5px;
		background: #FFFFFF;
		border-radius: 4px;
		cursor: pointer;
		z-index: 1000;
		border: 1px solid #36ADE4;
	}
	header #global_navi #menu_icon span {
		display: block;
		height: 3px;
		background: #36ADE4;
		border-radius: 2px;
		transition: 0.4s;
	}
	header #global_navi #menu_icon span:nth-child(2) { margin: 6px 0; }
	/* Xに変形 */
	header #global_navi #menu_toggle:checked + #menu_icon span:nth-child(1) { transform: translateY(10px) rotate(45deg); }
	header #global_navi #menu_toggle:checked + #menu_icon span:nth-child(2) { opacity: 0; }
	header #global_navi #menu_toggle:checked + #menu_icon span:nth-child(3) { transform: translateY(-10px) rotate(-45deg); }
	header #global_navi #menu_toggle:checked ~ .overlay {
		opacity: 1;
		pointer-events: auto;
	}
	/* メニュー本体(右から表示) */
	header #global_navi nav {
		position: fixed;
		top: 0;
		right: -100%; /* 初期位置 */
		width: 100%;
		height: 100%;
		padding: 80px 5px 0 5px;
		background: #E2E8F0;
		transition: right 0.4s ease;
		z-index: 900;
	}
	header #global_navi #menu_toggle:checked ~ nav {
		right: 0;
		overflow-x: scroll;
	}
	header #global_navi nav ul {
		display: grid;
		grid-template-columns: 1fr 1fr;
	}
	header #global_navi nav li {
		height: 80px;
		margin: 5px;
	}
	header #global_navi nav a {
		display: flex;
    align-items: center;
    justify-content: space-around;
		width: 100%;
		height: 100%;
		background: #FFFFFF;
		border-radius: 10px;
	}
	header #global_navi nav a:hover {
		background: #36ADE4;
		color: #FFFFFF!important;
	}
	/* top_main_img -------------------- */
	#top_contents #top_main_img {	height: 100vh; }
	/* 基本線 */
	#top_contents #top_main_img .line { bottom: 50%; }
	/* 中央要素の初期状態（下に隠して非表示） */
	#top_contents #top_main_img .center_item {
		bottom: 50%;
		text-align: center;
	}
	#top_contents #top_main_img .center_item img { width: 80%; }
	/* top -------------------- */
	#top_contents h2 {
		margin: 0 0 20px 0;
		font-size: 150%;
	}
	#top_contents h2 span { font-size: 60%; }
	/* top_company */
	#top_contents #top_company {
		padding: 50px 20px;
		background-size: 60%;
	}
	#top_contents #top_company p {
		margin: 0 0 30px 0;
		font-size: 120%;
	}
	/* top_our_service */
	#top_contents #top_our_service { padding: 50px 20px; }
	#top_contents #top_our_service div {
		display: block;
		width: auto;
	}
	#top_contents #top_our_service div section {
		width: 100%;
		margin-bottom: 20px;
		padding: 20px 0;
		background-size: cover;
	}
	#top_contents #top_our_service div section h3 { font-size: 130%; }
	#top_contents #top_our_service div section h3 span {
		display: block;
		font-size: 80%;
	}
	#top_contents #top_our_service div section:last-child {	margin-bottom: 0; }
	/* top_news */
	#top_contents #top_news {
		width: 100%;
    grid-template-columns: 1fr;
    grid-template-areas:
      "title"
      "list"
      "more";
		padding: 50px 20px;
  }
	#top_contents #top_news div { margin-top: 20px; }
	#top_contents #top_news dl {
		display: block;
		font-size: 90%;
	}
	#top_contents #top_news dl dt ,
	#top_contents #top_news dl dd {
		margin: 0;
		padding: 10px 20px;
		background: #F7F9FA;
		border-top: none;
		border-bottom: none;
		border-right: solid 1px #E2E8F0;
		border-left: solid 1px #E2E8F0;
	}
	#top_contents #top_news dl dt {
		padding-bottom: 0;
		border-top: solid 1px #E2E8F0;
		border-radius: 6px 6px 0px 0px;
	}
	#top_contents #top_news dl dd {
		margin-bottom: 10px;
		border-bottom: solid 1px #E2E8F0;
		border-radius: 0px 0px 6px 6px;
	}
	/* top_other */
	#top_contents #top_other { padding: 50px 20px; }
	#top_contents #top_other div {
		display: block;
		width: auto;
	}
	#top_contents #top_other div p {
		width: 100%;
		margin-bottom: 20px;
		font-size: 120%;
	}
	#top_contents #top_other div p:last-child { margin-bottom: 0; }
	#top_contents #top_other div p a {
		display: grid;
    align-items: center;
		height: 100px;
		padding: 10px;
	}
	/* 下層 -------------------- */
	/* main_img */
	#main_img {
		position: relative;
		line-height: 0;
		z-index: 800;
	}
	#main_img h1 {
		top: 45%;
		font-size: 140%;
	}
	#main_img h1 span { font-size: 60%; }
	#main_img img { height: 150px; }
	/* パンくずリスト */
	ul#breadcrumbs { display: none; }
	#contents {
		width: 100%;
		margin: 0 auto;
		padding: 50px 20px;
	}
	#contents #catchphrase {
		padding-bottom: 50px;
		font-size: 150%;
		line-height: 1.4;
	}
	#contents #catchphrase br { display: none; }
	#contents h2 { font-size: 130%; }
	#contents h3 {
		margin-bottom: 30px;
		font-size: 120%; 
	}
	#contents table th ,
	#contents table td { padding: 10px; }
	#contents table th { width: auto; }
	#contents .contents_area { padding-bottom: 50px; }
	/* 代表メッセージ */
	#president_message { display: block; }
	#president_message div:first-child {
		margin-right: 0;
		margin-bottom: 20px;
	}
	/* 経営理念 */
	#corporate_philosophy {	display: block; }
	#corporate_philosophy section h4 {
		padding: 0 0 10px 0;
		font-size: 140%;
	}
	#corporate_philosophy section { margin: 0 0 20px 0; }
	#corporate_philosophy section:last-child { margin: 0; }
	#corporate_philosophy section div {
		height: auto;
		padding: 10px;
	}
	/* 会社概要 */
	#company_data { display: block; }
	#company_data div {
		display: block;
		padding-bottom: 20px;
	}
	#company_data div img { width: 70%; }
	/* 沿革 */
	dl#history dt {
		margin-top: 20px;
		padding: 5px 10px;
		background-image: linear-gradient(90deg, rgba(56, 189, 248, 1) 75px, rgba(255, 255, 255, 1) 75px);
	}
	dl#history dd { padding: 10px 0px 10px 10px; }
	dl#history dd:nth-of-type(odd) { width: 90px; }
	dl#history dd:nth-of-type(even) {
		margin-left: 90px;
		padding: 10px 10px 10px 0;
	}
	/* アクセス */
	#access { display: block; }
	#access section { margin: 0 0 20px 0; }
	#access section:last-child { margin: 0; }
	#access section h4 { font-size: 110%; }
	#access section p {
		padding: 5px 10px;
		font-size: 90%;
	}	
	/* 親会社のご紹介 */
	#parent_company section {
		display: block;
		padding: 10px 0;
	}
	#parent_company section div { display: block; }
	#parent_company section div:first-child {
		margin-bottom: 20px;
		padding: 0 20px;
	}
	#parent_company section div:first-child img { max-height: 60px; }
	#parent_company section div { padding: 0 20px; }
	/* 資格取得状況 */
	table#qualification_status th ,
	table#qualification_status td:nth-of-type(2) { text-align: center; }
	table#qualification_status th:first-child { width: auto; }
	table#qualification_status th:nth-of-type(2) { width: 30%; }
	/* 事業内容 */
	#development_link section { display: block; }
	#development_link section div:first-child {
		display: block;
		padding: 10px;
		height: 100px;
		border-radius: 10px 10px 0 0;
	}
	#development_link section div p {
		font-size: 160%;
		line-height: 1.2;
	}
	#development_link section div p span {
		display: block;
		font-size: 70%;
	}
	#development_link section div#system ,
	#development_link section div#app {
		height: 120px;
		border-radius: 0 0 10px 10px;
	}
	#development_link section div#system a ,
	#development_link section div#app a {
		bottom: 10px;
		right: 10px;
	}
	/* 開発体制、感染症対策について */
	#project_structure ,
	#infection_prevention {	display: block; }
	#project_structure div ,
	#infection_prevention div { padding-left: 0; }
	/* 開発スキル */
	#dev_skill { display: block; }
	#dev_skill section { margin: 0; }
	#dev_skill section h3 { font-size: 100%; }
	#dev_skill section p { font-size: 90%; }
	/* 開発の流れ */
	#development_flow dt { font-size: 120%; }
	#development_flow dt span {
		width: 60px;
		height: 60px;
		padding: 8px 0;
		font-size: 140%;
	}
	#development_flow dd {
		margin-left: 0;
		margin-top: 20px;
		padding: 10px;
	}
/* 開発実績 */
#track_record {	display: block; }
#track_record section { margin: 10px 0; }
#track_record section h3 { font-size: 100%; }
#track_record section span { font-size: 76%; }
	/* 健康経営宣言 */
	#declaration { display: block; }
	#declaration div:first-child { margin-right: 0; }
	#declaration div ol {
		list-style-type: none;
		margin: 20px 0;
	}
	#declaration div ol li ul {
		list-style: disc;
		margin: 10px 0;
	}
	#declaration div ol li ul li { margin-left: 3.5em; }
	#kenko_news {
		margin-bottom: 50px;
		padding: 50px 20px;
	}
	/* 健康経営　最新の投稿 */
	#kenko_news div { width: 100%; }
	#kenko_news div dl { display: block; }
	#kenko_news div dl dt {
		padding: 10px 10px 0 10px;
		border-bottom: none;
		font-size: 90%;
	}
	#kenko_news div dl dd {
		margin-left: 0;
		padding: 10px;
	}
	/* SDGs宣言 */
	#sdgs_declaration { display: block; }
	#sdgs_declaration div:first-child {
		margin-right: 0;
		margin-bottom: 20px;
	}
	/* SDGs */
	#sdgs_contents { display: block; }
	#sdgs_contents section {
		margin: 0 0 20px 0;
		padding: 10px;
	}
	#sdgs_contents section h3 {
		margin-bottom: 20px;
		font-size: 120%;
	}
	#sdgs_contents section div { margin-bottom: 20px; }
	/* 社内での小さな取り組み */
	#initiatives { display: block; }
	#initiatives div:first-child {
		margin-right: 0;
		overflow-wrap: anywhere;
	}
	/* 情報セキュリティ方針、個人情報保護方針 */
	#policy ul ,
	#policy ol { margin: 0 0 40px 30px; }
	/* お問い合わせ */
	dl#inquiry { display: block; }
	dl#inquiry dt {
		padding: 10px;
		border-bottom: none;
	}
	dl#inquiry dt span { font-size: 76%; }
	dl#inquiry dd {
		margin-left: 0;
		padding: 0 10px 15px 10px;
	}
	dl#inquiry dd div#postal_code_area input,
	dl#inquiry dd#tel_area input { width: 80px; }
	#inquiry_btn_area {	padding-top: 50px; }
	/* ビジネスパートナー募集 */
	#partner_recruitment { display: block; }
	#partner_guidelines { grid-template-columns: 1fr; }
	#partner_recruitment div:first-child { margin-right: 0; }
	#partner_guidelines div:last-child {
		margin-left: 0;
		margin-bottom: 20px;
		order: 1;
	}
	#partner_guidelines div:first-child { order: 2; }
	#partner_recruitment div p .btn_black {
		margin-top: 20px;
		margin-bottom: 20px;
	}
	#partner_qa h3 {
		width: auto;
		margin: 0;
		font-size: 110%;
	}
	#partner_qa dl {
		padding: 10px;
		border-radius: 0 0 10px 10px;
	}
	#partner_qa dl dt ,
	#partner_qa dl dd {
		position: relative;
		margin-bottom: 25px;
		padding-left: 45px;
	}
	#partner_qa dl dd { padding-bottom: 25px; }
	#partner_qa dl dt::before { font-size: 110%; }
	#partner_qa dl dd::before { font-size: 110%; }
	/* お知らせ */
	#news_contens { display: block; }
	/* お知らせ一覧 */
	#news_contens #news_list_area { display: block; }
	#news_contens #news_list_area section {
		display: block;
		margin: 0 0 10px 0;
		padding: 10px;
	}
	#news_contens #news_list_area section div { min-height: 120px; }
	#news_contens #news_list_area section div:first-child { min-height: auto; }
	#news_contens #news_list_area section div img {
		width: 100%;
		margin-bottom: 10px;
	}
	#news_contens #news_list_area section div span {	font-size: 90%; }
	#news_contens #news_list_area section div h3 {	font-size: 100%; }
	#news_contens #news_list_area section div p { font-size: 90%; }
	#news_contens #news_list_area section div a.news_link { font-size: 76%; }
	/* お知らせ詳細 */
	#news_contens #news_detail_area #news_detail_meta { padding: 20px 0!important; }
	#news_contens #news_detail_area #news_detail_meta p {
		font-size: 90%;
		padding: 10px 0 0 0;
	}
	/* お知らせサイドメニュー */
	#news_contens #news_side_navi {	margin: 40px 0 0 0; }
	#news_contens #news_side_navi section h3 {	font-size: 125%; }
	#news_contens #news_side_navi section ul {
		margin: 10px 0 40px 0;
		font-size: 90%;
	}
	#news_contens #news_side_navi section:last-child ul { margin: 10px 0 0 0; }
	#news_contens #news_side_navi section ul li a { padding: 10px; }
	/* footer -------------------- */
	footer { padding: 10px; }
	footer #footer_contents { font-size: 76%; }
	footer #footer_contents ul { width: 100%; }
	footer #footer_contents ul li { display: block; }
	footer #footer_contents ul li a {
		display: block;
		margin: 0 10px;
		padding: 10px 10px;
		border-right: none;
		border-bottom: dashed 1px #5D5D5D;
		text-align: left;
	}
	footer #footer_contents p { padding-bottom: 10px; }
	footer #footer_contents p#footer_logo { padding: 25px 0 40px 0; }
	footer #footer_contents p#copyright { padding: 0; }
	
	/* 共通 -------------------- */
	/* カラム */
	.photo-col-2 { display: block; }
	.photo-col-2 div:first-child { margin-right: 0; }
	/* ボタン系 */
	a.btn_black {
		font-size: 90%;
	}
	a.btn_black:hover { background: #38BDF8; }
	a.btn_white {
		font-size: 90%;
	}

	.pc { display: none; }
}
