@charset "utf-8";
	/* CSS Document */

	.bkc {
		background-color: #FCF2D3;
	}

	h4 {
		font-family: dnp-shuei-mgothic-std, sans-serif;
		font-weight: 400;
		font-style: normal;
		padding-bottom: 10px;
		padding-top: 20px;
		font-size: 14pt;
	}
	.concept_title {
		color: #F6AE6A;
		border-bottom: #F6AE6A 1.5px solid;
		font-weight:bold;
		font-size: 13pt;

		/*border-width: 0 0 8px;
		border-style: solid;
		border-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 0.8 1"><circle fill="hsla(29.14, 88.61%, 69.02%, 1.0)" cx="0.4" cy="0.5" r="0.15"/></svg>') 0 0 100% repeat;	*/	

		padding-bottom: 7px;
		/*background-image:url("../img/dot_mobile_concept.png");
		background-position:bottom;
		background-repeat:repeat-x;*/
	}
	.concept_body {
		padding-left: 10px;
		padding-right: 10px;
		color: #AE9E84;
		text-align: left;
	}
	p {
		font-family: dnp-shuei-mgothic-std, sans-serif;
		font-style: normal;
		color:#979797;
		font-size:12pt;
	}


	.video {
	  // iPhone safariの枠線を消す
	  filter: drop-shadow(0px 0px rgba(0,0,0,0));

	  // PCのChromeの枠線を消す
	  outline: none;
	  border: none;
	}

	.aligncenter
	{
		float:left;
		width:100%;
		text-align:center;

	}

	.tbl-title {
		background-color: #CDC5A9;
	}
	.konzatsuTime{
		font-size:8pt;
		color:#AE9E84;
	}
	.kadomaru{
		border-radius: 35px;
	}
	h2 {
		font-family: dnp-shuei-mgothic-std, sans-serif;
		font-weight: 600;
		font-style: normal;
		color:#AE9E84;
	}

	td {
		text-align: center;
		vertical-align: middle;
		color:#AE9E84;
	}
	#map {
	   width: 100%;
	   height: 400px;
	   background-color: grey;
	 }

	/* PCでは旧iframe(500px)と同等の高さに */
	@media (min-width: 992px) {
		#map { height: 500px; }
	}

	#map2 {
	   width: 100%;
	   height: 400px;
	   background-color: grey;

	 }

	.news-date{
		color:#979797;
		/*font-size:10pt;*/
	}
	.news-body{
		color:#979797;
		/*font-size:10pt;*/
		/*line-height:9px;*/
	}

	footer {
		display: none;
	/* 他のスタイル設定 */
	}

	@media (min-width: 900px){
	  footer2{ display: none; }
	}

	.video_wrapper {
	position: relative;
	/*width: 100vw;*/
	height: calc(88vh - 90px);
	overflow: hidden;
	}

	.video_wrapper > video {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translateX(-50%) translateY(-50%);
		height: 100%;
	}

	.dotline{
		border: none;border-top: 2px dotted #AE9E84;
	}

	.dotline2{
		/*border-width: 0 0 8px;
		border-style: solid;
		border-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1.2 1"><circle fill="hsla(37.14, 20.59%, 60%, 1.0)" cx="0.6" cy="0.5" r="0.25"/></svg>') 0 0 100% repeat;
		width: 90%;
		text-align: center;*/

		border: none;border-top: 5px dotted #AE9E84;
		margin-left:50px;
		margin-right:50px;

		/*
		padding-bottom: 7px;
		background-image:url("../img/dot_pc_hr.png");
		background-position:bottom;
		background-repeat:repeat-x;
		margin-left:50px;
		margin-right:50px;*/
	}

	.pclogo{
		max-width: 300px;
	}
	@media screen and (min-width: 800px) and (max-width: 1170px) {
		/* タブレット */
			.pclogo{
				max-width: 230px;
			}
		}

	.pcsideicon{
		max-height:80px;
	}
	@media screen and (min-width: 800px) and (max-width: 1170px) {
		/* タブレット */
			.pcsideicon{
				max-height:70px;
			}
		}

	navpc {
		width: 100%;
		height: 70px;
		padding-top: 5px;
		box-sizing: border-box;

	}
	navpc ul {
		display: flex;
		list-style-type: none;
		padding-left:15px;
		padding-top:10px;
	}
	navpc li {
		list-style: none;
		padding-right:3px;
		padding-left:3px;
	}
	navpc li {
		list-style: none;
		color: #AE9E84;
	}
	navpc a {





	}

	@media screen and (min-width: 800px) and (max-width: 1170px) {
		/* タブレット */
			navpc a{
				font-size:1.25vw;
			}
		}

	navpc li:not(:last-child){
		border-right:2px dotted #EDAA68;
	}
	navpc a:hover{
		color:#EAA669;
	}


	.newspc
	{
		font-size:12pt;
		color:#979797;
	}

	.conceptpc_title {
		color: #EDAA68;
		border-bottom: #F6AE6A 1.5px solid;
		border-radius: 1px;
		display: inline-block;
		font-size:14pt;
		font-weight:bold;
		padding-bottom:5px;
		margin-bottom: 15px;
	}
	.conceptpc_body {
		padding-right: 10px;
		color: #AE9E84;
		text-align: left;
		font-size:12pt;
	}
	.text-right{
		text-align:right;
	}

	.side_chara
	{
		position:absolute;
		top:calc(70vh / 2);
		left:35%;
	}
	.side_howto
	{
		position:absolute;
		top:calc(100vh - 230px);
		text-align: center;
	}

	#side_menu ul{ 
		margin: 0; 
		padding :0; 
		list-style: none; 
		padding-left:10px;
		padding-bottom:50px;
		text-align: left;
	}
	#side_menu li{ 
		padding :0; 
		margin:0; 
	}
	#side_menu li a{
		display: block;
		padding: 4px 0px 5px 5px;
		margin-left:18px;
		color:#AE9E84;
		text-decoration:none;
		border-bottom: 4px dotted #EDAA68;
		font-size: 11pt;
		max-width:210px;
		padding-bottom: 7px;
	}

	#side_menu li a:hover{
		color:#EAA669;
		background-image: url("../img/sidemenu_active.svg");
		background-repeat: no-repeat;
		background-position: right;
		background-size: contain;
	}

	side_menu{
		display: none;
	}

	#iconfix{
		position:fixed;
		bottom:0px;
		width:100%;
		height:auto;
		background:#333;
		color:#fff;
		margin:20px;
		text-align:center;
	}
	#item-box li{
	  list-style: none;
		padding-right:10px;
	}
	#item-box ul{
	  display: flex;
	}


	#page_top{
	  width: 80px;
	  height: 80px;
	  position: fixed;
	  right: 80px;
	  bottom: 80px;
	}
	#page_top a{
	  position: relative;
	  display: block;
	  width: 80px;
	  height: 80px;
	  text-decoration: none;
	}
	#page_top a::before{
	  color: #fff;
	  position: absolute;
	  width: 40px;
	  height: 40px;
	  top: -5px;
	  bottom: 0;
	  right: 0;
	  left: 0;
	  margin: auto;
	  text-align: center;
	}



	#page_top_mobi{
	  width: 60px;
	  height: 60px;
	  position: fixed;
	  right: 10px;
	  bottom: 120px;
	}
	#page_top_mobi a{
	  position: relative;
	  display: block;
	  width: 60px;
	  height: 60px;
	  text-decoration: none;
	}
	#page_top_mobi a::before{
	  color: #fff;
	  position: absolute;
	  width: 30px;
	  height: 30px;
	  top: -5px;
	  bottom: 0;
	  right: 0;
	  left: 0;
	  margin: auto;
	  text-align: center;
	
	}

	.base_padding {
		padding-top: 10px;
		padding-left: 20px;
		padding-right: 20px;
		padding-bottom: 20px;
	}

	@media (min-width: 900px) {
		.base_padding {
			padding-top: 10px;
			padding-left: 50px !important;
			padding-right: 50px !important;
			padding-bottom: 20px;
		}
	}
	.pagetitle {
		text-align: center;
		font-size: 16pt;
		color: #B39F83;
	}

	.pagesubtitle {
		font-size: 14pt;
		padding-top: 10px;
		padding-bottom: 10px;
	}


	.pagesubtitle_brown {
		font-size: 14pt;
		padding-top: 10px;
		padding-bottom: 10px;
		color: #AE9E84;
	}

	ul.first_link {
		list-style: none;
		list-style-type: none;
		line-height: 20px;
		font-size: 14pt;
		color: #959595;
	}

	li.first_link_li {
		padding-left: 1.2em;
		background-image: url(../img/first/link.png);
		background-repeat: no-repeat;
		background-size: 1em;
		background-position: left center;
	}


	.first_maptitle {
		color: #EDAA68;
		border-bottom: #F6AE6A 1.5px solid;
		border-radius: 1px;
		display: inline-block;
		font-size: 14pt;
		font-weight: bold;
		padding-bottom: 5px;
		margin-bottom: 15px;
	}

	.first_mapbody {
		padding-right: 10px;
		color: #AE9E84;
		text-align: left;
		font-size: 11pt;
	}

	a, a:hover, a:visited {
		color: inherit;
	}



	.midashi_title {
		font-size: 20pt;
		color: #AE9E83;
		padding-bottom: 30px;
		padding-top: 30px;
		padding-left: 2.5em;
		background-image: url(../img/midashiicon.png);
		background-repeat: no-repeat;
		background-size: 2.7em;
		background-position: left center;
		margin-top: 10px;
		margin-bottom: 10px;
		margin-left:-20px;
	}




	.main_title {
		font-size: 16pt;
		color: #AE9E83;
		padding-bottom: 10px;
		padding-top: 10px;
		padding-left: 2.3em;
		background-image: url(../img/titleicon.png);
		background-repeat: no-repeat;
		background-size: 2em;
		background-position: left center;
		margin-top: 20px;
		margin-bottom: 10px;
	}
	@media only screen and ( max-width: 419px ) {
		.main_title {
			text-align:left;
			font-size: 16pt;
			color: #AE9E83;
			padding-bottom: 10px;
			padding-top: 10px;
			padding-left: 2.3em;
			background-image: url(../img/titleicon.png);
			background-repeat: no-repeat;
			background-size: 2em;
			background-position: left center;
			margin-top: 20px;
			margin-bottom: 10px;
		}
	}

	.main_body{
		font-size:11pt;
		color:#979797;
	}


	.main_subtitle {
		font-size: 14pt;
		color: #AE9E83;
		padding-bottom: 10px;
		padding-top:20px;
	}

	.main_img {
		text-align: center;
		margin-top: 20px;
		margin-bottom: 20px;
	}

	.main_img img {
		width: 70%;
		border: 1px solid #AE9E83;
	}

	@media only screen and ( max-width: 419px ) {
		.main_img img {
			width: 100%
		}
	}

	.main_img2 {
		text-align: center;
		margin-top: 20px;
		margin-bottom: 20px;
	}
	.main_img2 img {
		width: 70%;
	}

	@media only screen and ( max-width: 419px ) {
		.main_img2 img {
			width: 100%
		}
	}

	.main_body_rightimg {
		float: right;
		width: 70%;
		padding-left: 10px;
	}
	@media only screen and ( max-width: 419px ) {
		.main_body_rightimg {
			width: 100%;
			float:none;
		}
	}


	.main_subtitle1 {
		font-size: 13pt;
		color: #AE9E83;
		padding-top: 30px;
		padding-bottom: 15px;
	}
						
	.main_subtitle2 {
		font-size: 13pt;
		color: #AE9E83;
		padding-top: 30px;
		padding-bottom: 20px;
	}

	.main_subtitle2 u {
		text-decoration: none;
		border-bottom: #F6AE6A 1.5px solid;
	}


	.main_obi {
		background-color: #FCFBEF;
	}
	.main_obi img 
	{
		width: 15%;
	}
	@media only screen and ( max-width: 419px ) {
		.main_obi img {
			width: 30%;
		}
	}


	li.main_link_li {
		padding-left: 1.2em;
		background-image: url(../img/first/link.png);
		background-repeat: no-repeat;
		background-size: 1em;
		background-position: left center;
	}
	@media only screen and ( max-width: 419px ) {
		li.main_link_li {
			padding-left: 1.2em;
			background-image: url(../img/first/link.png);
			background-repeat: no-repeat;
			background-size: 1em;
			background-position: left center;
			margin-top:20px;
		}
	}

	.bold_color {
		color: #92bf58;
	}

	.bold_moji{
		color: #92bf58;
		font-size:13pt;
	}



	ul.main_link {
		list-style: none;
		list-style-type: none;
		line-height: 30px;
		font-size: 14pt;
		color: #959595;
	}
	@media only screen and ( max-width: 419px ) {
		ul.main_link {
			list-style: none;
			list-style-type: none;
			line-height: 20px;
			font-size: 12pt;
			color: #959595;
			padding-left:0px;
			padding-top:10px;
		}
	}


	.main_link_padding {
		padding-top: 10px;
		padding-left: 20px;
		padding-right: 20px;
		padding-bottom: 20px;
	}
	@media (min-width: 900px) {
		.main_link_padding {
			padding-top: 30px;
			padding-left: 50px;
			padding-right: 50px;
			padding-bottom: 20px;
		}
	}




	ul.head_link {
		list-style: none;
		list-style-type: none;
		line-height: 40px;
		font-size: 14pt;
		color: #959595;
	}

	@media only screen and ( max-width: 419px ) {
		ul.head_link {
			list-style: none;
			list-style-type: none;
			line-height: 20px;
			font-size: 12pt;
			color: #959595;
			padding-left: 0px;
			padding-top: 10px;
		}
	}



	li.head_link_li {
		padding-left: 2em;
		padding-top:0px;
		background-image: url(../img/first/link.png);
		background-repeat: no-repeat;
		background-size: 1.8em;
		background-position: left center;
	}

	@media only screen and ( max-width: 419px ) {
		li.head_link_li {
			padding-left: 2.2em;
			background-image: url(../img/first/link.png);
			background-repeat: no-repeat;
			background-size: 2em;
			background-position: left center;
			margin-top: 20px;
		}
	}


	.head_link_padding {
		margin-top:20px;
		margin-bottom:10px;
		padding-top: 30px;
		padding-left: 50px;
		padding-right: 50px;
		padding-bottom: 20px;
	}

	@media only screen and ( max-width: 419px ) {
		.head_link_padding {
			margin-top:20px;
			padding-top: 5px;
			padding-left: 20px;
			padding-right: 20px;
			padding-bottom: 20px;
		}
	}


	.youtube {
		/*padding-bottom: 30px;*/
		aspect-ratio: 16 / 9;
	}
	.youtube iframe {
		/*padding-top:30px;*/
		padding-bottom: 0px;
		margin-bottom: 0px;
		width: 70%;
	}
	@media only screen and ( max-width: 419px ) {
		.youtube iframe {
			width: 100%
		}
	}


	.main_head {
		text-align: center;
		margin-top: 20px;
		margin-bottom: 20px;
	}

	.main_head img {
		width: 70%;
	}

	@media (min-width: 900px) {
		.main_head img {
			width: 50%;
		}
	}


	.koentable table {
		border-collapse: collapse;
	}
	.koentable th, .koentable td {
		border: solid 1px #B39F83; /* 枠線指定 */
	}
	.koentable .left {
		background-color: #D6CEC1;
		color: white;
	}
	.koentable .right {
		color: #B39F83;
		text-align:left;
	}

	.koentoiawase{
		max-width:400px;
	}
	@media only screen and ( max-width: 419px ) {
		.koentoiawase {
			max-width:300px;
		}
	}

	.suisenbox {
		border: 1px solid #AE9E84;
	}
	.suisenbox .col-md-3 img {
		aspect-ratio: 1 / 1;
		object-fit: cover;
	}
	.suisenbox .suisen_kbn1 {
		background-color: #B6BDDC;
		color: white;
		font-size: 9pt;
	}
	.suisenbox .suisen_kbn2 {
		background-color: #D3966F;
		color: white;
		font-size: 9pt;
	}

		.suisenbox .suisen_tokobi {
			color: #AE9E84;
			font-size: 8pt;
		}

	.suisenbox .suisen_title {
		color: #959595;
		font-size: 14pt;
		font-weight: bold;
	}

	.suisenbox .suisen_dtl {
		color: #AE9E84;
		font-size: 10pt;
		line-height: 13pt;
		padding-top: 5px;
		padding-bottom: 5px;
	}


	.suisenbox .suisen_more {
		background-color: #AE9E84;
		color: white;
	}

	.suisenbox .suisen_more:hover {
		background-color: #AE9E84;
		color: white;
	}

	.kiji_more {
		background-color: #AE9E84;
		color: white;
	}
	.kiji_more:hover {
		background-color: #AE9E84;
		color: white;
	}


	.kiji_title {
		border-bottom: 1px solid #AE9E84;
		font-size: 18pt;
		padding-bottom: 10px;
		/* 記事タイトルを div から h1 にしたため、Bootstrap の
		   h1 { margin-bottom:.5rem; line-height:1.2 } と
		   style2.css の h1-h6 { font-family:"Raleway" } を打ち消す。
		   下の 992px / 1200px のルールは後勝ちなのでそのまま効く。 */
		margin-top: 0;
		margin-bottom: 0;
		line-height: inherit;
		font-family: inherit;
	}
	@media (min-width: 992px) {
		.kiji_title {
			font-family: dnp-shuei-mgothic-std, sans-serif;
			font-weight: 600;
			font-style: normal;
			color: #AE9E84;
		}
	}
	@media (min-width: 1200px) {
		.kiji_title {
			font-size: 2rem;
			line-height: 1.2em;
		}
	}

	.kiji_date {
		text-align: right;
		color: #AE9E84;
	}
	.kiji_line a {
		text-decoration: underline;
	}

	.column_kbn9 {
		background-color: #B39F83;
		color: white;
		font-size: 9pt;
	}
	.column_kbn10 {
		background-color: #F3AB6A;
		color: white;
		font-size: 9pt;
	}
	.column_kbn11 {
		background-color: #AECA67;
		color: white;
		font-size: 9pt;
	}
	.column_kbn12 {
		background-color: #E2B69A;
		color: white;
		font-size: 9pt;
	}
	.column_kbn14 {
		background-color: #EFBB5E;
		color: white;
		font-size: 9pt;
	}
	.column_kbn37 {
		background-color: #D3966F;
		color: white;
		font-size: 9pt;
	}
	.column_kbn13 {
		background-color: #B6BDDC;
		color: white;
		font-size: 9pt;
	}

	.doga_kbn39 {
		background-color: #B6BDDC;
		color: white;
		font-size: 9pt;
	}
	.doga_kbn39:hover {
		background-color: #B6BDDC;
		color: white;
	}
	.doga_kbn39:visited {
		color: white;
	}


	.doga_kbn40 {
		background-color: #D3966F;
		color: white;
		font-size: 9pt;
	}
	.doga_kbn40:hover {
		background-color: #D3966F;
		color: white;
	}
	.doga_kbn40:visited {
		color: white;
	}

	.doga_kbnall {
		background-color: #959595;
		color: white;
		font-size: 9pt;
	}

	.doga_kbnall:hover {
		background-color: #959595;
		color: white;
	}

	.doga_kbnall:visited {
		color: white;
	}




	.dropdown__lists {
		display: none; /*デフォルトでは非表示の状態にしておく*/
		width: 100%;
		position: absolute;
		top: 70px;
		left: 500px;
	}

	.gnavi__list:hover .dropdown__lists {
		display: block; /*Gナビメニューにホバーしたら表示*/
	}

	.dropdown__list {

		height: 30px;
		transition: all .3s;
		position: relative;
	}

	.dropdown__list:not(:first-child)::before {
		content: "";
		width: 100%;
		height: 1px;
		position: absolute;
		top: 0;
		left: 0;
	}

	.dropdown__list:hover {
		/*background-color: #003558;*/
	}

	.dropdown__list a {
		display: flex;
		justify-content: center;
		align-items: center;
		color: #ae9e83;
		text-decoration: none;
		position: relative;
	}

	.dropdown__list a::before {
		content: '';
		display: block;
		width: 6px;
		height: 6px;
		border-top: 2px solid #fff;
		border-left: 2px solid #fff;
		transform: rotate(135deg);
		position: absolute;
		right: 15px;
		top: calc(50% - 5px);
	}



	/*
		ページ内リンク微調整
	*/
	a.anchor {

	}

	/*
		ローダー
	*/

	#kijiloader {
		position: absolute;
		left: 50%;
		top: 50%;
		margin-left: -50px;
		margin-top: 100px;
		text-align: center;
		font-family: Arial;
		font-weight: bold;
	}

	#kijiloader span {
		display: block;
		background: #000;
		width: 100px;
		height: 5px;
		margin-top: 5px;
		animation: load 2s infinite;
		border-radius: 5px;
	}

	#kijiloader span:nth-child(2) {
		animation-delay: 100ms;
	}

	#kijiloader span:nth-child(3) {
		animation-delay: 200ms;
	}

	@keyframes load {
		50% {
			width: 5px;
			margin-right: 95px;
			opacity: .1;
		}
	}


	/*矢印*/
	.arrow {
		position: relative; /* 基準位置とする */
	}

	.arrow::before,
	.arrow::after {
		content: ""; /* 疑似要素に指定必須 */
		width: 20px; /* 線の長さを指定 */
		height: 3px; /* 線の幅を指定 */
		display: inline-block; /* インラインブロックにする */
		border-radius: 2px; /* 線を角丸にする */
		background: #aaa; /* 線の色を指定 */
		position: absolute; /* 相対位置に指定 */
		right: 10px; /* 右から10pxの位置に配置 */
	}

	.arrow::before {
		top: calc(50% - 8px); /* 数値は微調整してください */
		transform: rotate(45deg); /* 45度回転させる */
	}

	.arrow::after {
		bottom: calc(50% - 8px); /* 数値は微調整してください */
		transform: rotate(-45deg); /* -45度回転させる */
	}



	/*矢印*/
	.arrow2 {
		position: relative; /* 基準位置とする */
	}

	.arrow2::before,
	.arrow2::after {
		content: ""; /* 疑似要素に指定必須 */
		width: 20px; /* 線の長さを指定 */
		height: 3px; /* 線の幅を指定 */
		display: inline-block; /* インラインブロックにする */
		border-radius: 2px; /* 線を角丸にする */
		background: #aaa; /* 線の色を指定 */
		position: absolute; /* 相対位置に指定 */
		left: 10px; /* 右から10pxの位置に配置 */
	}

	.arrow2::before {
		top: calc(50% - 8px); /* 数値は微調整してください */
		transform: rotate(-45deg); /* 45度回転させる */
	}

	.arrow2::after {
		bottom: calc(50% - 8px); /* 数値は微調整してください */
		transform: rotate(45deg); /* -45度回転させる */
	}

	.btn_next {
		border: 1px solid #AE9E84;
		border-radius: 10px;
		margin: 5px;
	}
	.btn_prev {
		border: 1px solid #AE9E84;
		border-radius: 10px;
		margin: 5px
	}
	.btn_prevtitle {
		font-size: 12pt;
		padding-left: 20px;
		padding-right: 40px;
		line-height: 15pt;
	}
	.btn_nexttitle {
		font-size: 12pt;
		padding-left: 40px;
		padding-right: 10px;
		line-height: 15pt;
	}
	.btn_prevtxt {
		font-size: 12pt;
		padding-left: 40px;
		padding-right: 10px;
		line-height: 15pt;
	}

	.btn_nexttxt {
		font-size: 12pt;
		padding-left: 40px;
		padding-right: 10px;
		line-height: 15pt;
	}

	.btn_nextsubtitle {
		font-size: 9pt;
		padding-left: 40px;
	}
	.btn_prevsubtitle {
		font-size: 9pt;
		padding-left: 20px;
	}
	/*アコーディオン実装*/


	/*ベース*/
	.toggle {
		display: none;
	}

	.Label { /*タイトル*/
		padding: 0.5em;
		padding-left: 30px;
		display: block;
		background: white;
		border-radius: 10px 10px 10px 10px;
		cursor: pointer;
	}

	.Label::before { /*タイトル横の矢印*/
		content: "";
		width: 10px;
		height: 10px;
		border-top: 2px solid #F5911E;
		border-right: 2px solid #F5911E;
		-webkit-transform: rotate(45deg);
		position: absolute;
		top: calc( 50% - 3px );
		right: 20px;
		transform: rotate(135deg);
	}
	.Label2 { /*タイトル*/
		padding: 0.5em;
		padding-left: 30px;
		display: block;
		background: white;
		border-radius: 10px 10px 10px 10px;
		cursor: pointer;
	}

	.Label,
	.content {
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		transform: translateZ(0);
		transition: all 0.3s;
	}

	.content { /*本文*/
		height: 0;
		margin-bottom: 10px;
		padding: 0 20px;
		padding-left: 50px;
		overflow: hidden;
	}

	.content a {
			color: #959595;
		}

	.toggle:checked + .Label + .content { /*開閉時*/
		height: auto;
		padding-left: 50px;
		transition: all .5s;
		padding-top: 10px;
	}

	.toggle:checked + .Label::before {
		transform: rotate(-45deg) !important;
	}
	.Label_icon {
		width: 5%;
		margin-top: -3px;
	}
	@media only screen and ( max-width: 419px ) {
		.Label_icon {
			width: 10%;
			margin-top:-3px;
		}
	}

	.map-info-padding {
		padding-left: 30px;
		padding-right: 30px;
	}

	/* PC用pagetopボタン: SPでは非表示、PCではJS制御に任せる */
	@media (max-width: 991.98px) {
		#page_top { display: none !important; }
	}

	/* PC/SP表示切替 */
	.sp-only { display: block; }
	.pc-only { display: none !important; }
	@media (min-width: 992px) {
		.sp-only { display: none !important; }
		.pc-only { display: block !important; }
		.pc-only.row { display: flex !important; }

		.pc-float-right {
			float: right;
			width: 40%;
			padding-left: 10px;
		}
		.pc-float-left {
			float: left;
			width: 30%;
			padding-left: 10px;
		}
		.pc-img-wide {
			width: 95%;
		}
		.map-info-padding {
			padding-left: 100px;
			padding-right: 100px;
		}
	}

	/* ============================================
	   生物学的製剤一覧（旧 zensoku38.png のHTML化）
	   ============================================ */
	.bio_table_wrap {
		width: 100%;
		margin: 0 auto;
		box-sizing: border-box;
		background-color: #FFFFFF;
		container-type: inline-size;
		text-align: center;
	}

	.bio_table_inner {
		/* container query 非対応ブラウザ用のフォールバック */
		font-size: 18px;
		font-size: 2.57cqw;
		line-height: 1.5;
		color: #000000;
		padding: 3.1% 1.25% 2%;
	}

	.bio_table_title {
		font-size: 1.7em;
		line-height: 1.2;
		color: #464646;
		margin: 0 0 0.62em;
	}
	.bio_table_title span {
		border-bottom: 0.06em solid #464646;
		padding-bottom: 0.02em;
	}

	table.bio_table {
		width: 100%;
		margin: 0;
		table-layout: fixed;
		border-collapse: collapse;
	}
	table.bio_table th,
	table.bio_table td {
		border: 1px solid #B39F83;
		padding: 0.2em 0.15em;
		text-align: center;
		vertical-align: middle;
		font-weight: normal;
		background-color: #FFFFFF;
		color: #000000;
	}
	table.bio_table tr {
		height: 5.74em;
	}
	table.bio_table tr:last-child {
		height: 6.9em;
	}
	/* 列幅（元画像の比率） */
	table.bio_table th.bio_rowhead {
		width: 12.71%;
		background-color: #EDE7DC;
		font-size: 1.15em;
		line-height: 1.7;
	}
	/* 製剤名ヘッダー */
	table.bio_table th.bio_col {
		width: 17.458%;
		background-color: #E1D4C3;
	}

	/* 年齢の行は少し大きめ（元画像に合わせる） */
	table.bio_table td.bio_age {
		font-size: 1.2em;
	}
	/* ゾレアの投与間隔（3行） */
	table.bio_table td.bio_dose {
		font-size: 0.92em;
		line-height: 1.5;
		white-space: nowrap;
	}
	/* ファセンラの投与間隔（2行の小さい文字） */
	table.bio_table td.bio_small {
		font-size: 0.75em;
		line-height: 2;
		white-space: nowrap;
	}
	/* ○ × */
	table.bio_table td.bio_mark {
		font-size: 1.6em;
		line-height: 1;
	}

	/* ============================================
	   PC・スマートフォン共通レイアウト（2026テーマ）

	   本文HTMLを1ソース化したことに伴う土台のスタイル。
	   - スマートフォン: 1カラム（サイドバーは非表示）
	   - PC(992px以上): サイドバー + 本文の2カラム
	   旧テーマの .col-4 / .col-8 構成を Flexbox で再現している。
	   ============================================ */

	/* ============================================
	   CLS対策: width / height 属性の安全装置

	   width/height 属性を付けると、CSSで幅だけを指定している画像
	   （.main_head img の width:70% など）は高さが属性値のまま固定され
	   縦横比が崩れる。

	   :where() で詳細度を0にしているため、テーマ側の既存指定
	   （.main_head img の width:70% など）が必ず優先される。
	   属性値そのものはサイズに使わず、aspect-ratio による
	   読み込み前の領域確保だけを効かせるのが狙い。 */
	img[width][height] {
		height: auto;
	}

	/* 高さ側をCSSで制限している画像は、幅も auto にしないと
	   width属性の値がそのまま使われて横に伸びてしまう。
	   （幅のみ制限している画像に width:auto を掛けると
	     読み込み前の領域確保が効かなくなるため、ここだけに限定する） */
	#header .logo img[width][height],
	.pcsideicon[width][height],
	.fixed-bottom img[width][height],
	.top-linebtn[width][height] {
		width: auto;
	}

	/* コピーライト（旧: SP=7pt・row padding-top:30px / PC=10pt・row pt-5 pb-5） */
	.site-copyright { padding-top: 30px; }
	.site-copyright__text { font-size: 7pt; }

	/* スマートフォン: 通常の1カラム。サイドバーは .d-none.d-lg-block で非表示 */
	.site-body {
		display: block;
	}

	.site-main {
		min-width: 0;
	}

	/* PC用サイドメニューの固定表示（旧 style="position:fixed;bottom:10px;" 相当） */
	.side_menu_fixed {
		position: fixed;
		bottom: 10px;
	}

	@media (min-width: 992px) {

		/* サイドバー + 本文の2カラム */
		.site-body {
			display: flex;
			align-items: stretch;
		}

		/* 左カラム（旧 .col-4 p-5 pt-3 text-center sticky-top 相当）
		   position を持たせる必要がある。旧版は sticky-top が付いていたため、
		   内部の .side_chara / .side_howto（position:absolute）の基準になっていた。
		   static のままだとビューポート基準になり位置がずれる */
		.site-side {
			/* 旧 .col-4 の sticky-top と同一指定。flex の stretch により
			   高さは行いっぱいになるため sticky の挙動は発生しないが、
			   内部の絶対配置要素の基準として必要 */
			position: sticky;
			top: 0;
			z-index: 1020;
			flex: 0 0 33.3333%;
			max-width: 33.3333%;
			padding: 1rem 3rem 3rem;
			text-align: center;
			background-color: #FBF7E6;
		}

		/* 右カラム（旧 .col-8 pt-2 相当） */
		.site-main {
			flex: 1 1 auto;
			padding-top: 0.5rem;
			background-color: #FCF4DA;
		}

		/* PC用グローバルナビ
		   旧PC版は .row > .col-12 の中にあったため、同じ12pxのガターを持たせる */
		.site-nav {
			background-color: #FCF4DA;
			padding-left: 12px;
			padding-right: 12px;
		}

		/*
		   旧PC版は本文の <section class="clients3"><div class="container"> を
		   正規表現で除去して col-8 直下に流し込んでいた。
		   1ソース化後はタグが残るため、PCでは .container の幅制限を打ち消して
		   従来と同じ横幅で表示する。
		*/
		/* style2.css の section { padding: 60px 0 } による下余白を打ち消す。
		   旧PC版は <section> ごと除去していたため余白が付いていなかった */
		.site-main > section {
			padding-bottom: 0;
		}

		.site-main > section > .container {
			max-width: none;
			width: 100%;
			/* Bootstrapのガター(12px)は残す。内側 .row の負マージン(-12px)と
			   相殺され、旧PC版（section/containerを除去して .col-8 直下に
			   流し込んでいた）と同じ本文幅になる */
			padding-left: 12px;
			padding-right: 12px;
		}

		.site-copyright { padding-top: 3rem; padding-bottom: 3rem; }
		.site-copyright__text { font-size: 10pt; }

		/* SP用ページトップボタンはPCでは使わない（PC用 #page_top を使用） */
		#page_top_mobi {
			display: none !important;
		}
	}

	/* ============================================
	   トップページ PC/SP 共通化に伴うスタイル
	   旧SP版・旧PC版それぞれのインラインスタイルを
	   ブレークポイントごとに再現している。
	   ============================================ */

	/* .row に .sp-only / .pc-only を併用してもグリッドが崩れないように */
	.sp-only.row { display: flex; }

	/* 画像に直接 .sp-only / .pc-only を付けた場合の中央寄せ */
	.top-allergy__btn img,
	.top-aisatsu__more img { margin-left: auto; margin-right: auto; }

	/* ---------- スマートフォン（既存の見え方を維持） ---------- */
	.top-allergy   { padding-top: 10px; }
	.top-shinryo   { padding-top: 10px; padding-bottom: 30px; }
	.top-konzatsu  { padding-top: 30px; padding-bottom: 30px; }
	.top-aisatsu   { padding-top: 30px; padding-bottom: 30px; }
	.top-yoyaku    { padding-top: 30px; padding-bottom: 30px; }
	.top-address   { padding-top: 30px; }

	.top-allergy__title    { width: 80%; }
	/* 本番PC版のボタン画像はラベル文字が小さいため、スマートフォンでは
	   外側の余白を詰めて表示サイズを稼ぐ（旧SP版画像の頃は30px） */
	.top-allergy__btn--left  { padding-left: 12px; }
	.top-allergy__btn--right { padding-right: 12px; }

	.top-shinryo__title    { width: 70%; }
	.top-shinryo__pickup   { width: 50%; margin-top: 10px; }
	.top-shinryo__shikkan  { padding-top: 1rem; }
	.top-shinryo__icon     { padding-left: 7px; padding-right: 7px; }

	.top-konzatsu__title   { width: 40%; }
	/* 凡例: SPは横3列 */
	.top-konzatsu__legend { display: flex; justify-content: center; gap: 4%; padding-top: 20px; }
	.top-konzatsu__legend-item { flex: 0 1 30%; }
	.top-konzatsu__legend-item img { max-width: 60px; }
	.top-konzatsu .konz-th-corner { width: 80px; }
	.top-konzatsu .konz-th-time   { font-size: 9pt; line-height: 16px; }

	.top-aisatsu__title    { width: 70%; }
	.top-aisatsu__img      { width: 90%; }
	.top-aisatsu__body     { padding: 1.5rem; }
	.top-aisatsu__license  { line-height: 18pt; font-size: 10pt; }
	.top-aisatsu__text     { font-size: 11pt; padding-top: 10px; }
	.top-aisatsu__more img { width: 25%; }

	.top-yoyaku__title     { width: 60%; }
	.top-yoyaku__icons     { position: relative; }
	.top-yoyaku__kyushin   { position: absolute; right: 0; top: 20px; width: 25%; }
	.top-yoyaku__kyushin img   { max-width: 80px; }
	.top-yoyaku__madoguchi img { width: 60%; margin-top: 20px; }
	.top-yoyaku .yoyaku-th-time { font-size: 9pt; }
	.top-yoyaku .yoyaku-td-note { font-size: 7pt; line-height: 13px; }
	.top-yoyaku__note      { color: #af9f84; font-size: 10pt; }

	.top-address__map #map { width: 95%; margin: 0 auto; }
	.top-address__title    { max-width: 80px; }
	.top-address__head     { padding-top: 30px; padding-bottom: 1rem; }

	/* ---------- PC(992px以上): 旧PC版の見え方を再現 ---------- */
	@media (min-width: 992px) {

		.top-allergy  { padding-top: 1rem; }
		.top-shinryo  { padding-top: 1rem; padding-bottom: 3rem; }
		.top-konzatsu { padding-top: 1rem; padding-bottom: 3rem; font-size: 10pt; }
		.top-aisatsu  { padding-top: 1rem; padding-bottom: 3rem; }
		.top-yoyaku   { padding-top: 1rem; padding-bottom: 3rem; font-size: 10pt; }
		.top-address  { padding-top: 3rem; padding-bottom: 3rem; }

		/* 本番PC版と同じ表示サイズ（見出し300px・ボタン299px）に合わせる */
		.top-allergy__title   { width: auto; max-width: 300px; }
		.top-allergy__btn img { max-width: 299px; }

		/* 2つのボタンを中央に寄せ合わせ、間隔を本番PC版と同じ24px
		   （Bootstrap の列パディング12px×2）にする。
		   img は inline のため margin:auto では動かず、text-align で寄せる。 */
		.top-allergy__btn--left  { text-align: right; }
		.top-allergy__btn--right { text-align: left; }

		/* 見出しとピックアップを、スマートフォンと同じく縦並びにする。
		   <picture> は既定が inline のため PC 幅では横に並んでいた。 */
		.top-shinryo__head picture { display: block; }

		.top-shinryo__title   { width: auto; max-width: 350px; }
		.top-shinryo__pickup  { width: auto; max-width: 300px; margin-top: 2rem; }
		.top-shinryo__shikkan { padding-top: 3rem; padding-bottom: 3rem; }
		.top-shinryo__shikkan img { max-width: 550px; }
		.top-shinryo__main img    { max-width: 250px; }
		.top-shinryo__icon        { padding: 5px; }
		.top-shinryo__icon img    { max-width: 170px; }

		.top-konzatsu__title { width: auto; max-width: 150px; }
		.top-konzatsu__head  { padding-bottom: 3rem; }
		/* 凡例: PCは縦積み */
		.top-konzatsu__legend { display: block; padding-top: 0; }
		.top-konzatsu__legend-item { padding-top: 0.75rem; }
		.top-konzatsu__legend-item img { max-width: 80px; }
		.top-konzatsu .konz-th-corner { width: 100px; }
		.top-konzatsu .konz-th-time   { font-size: 9pt; line-height: normal; }

		.top-aisatsu__title   { width: auto; max-width: 350px; }
		.top-aisatsu__photo   { padding-top: 3rem; padding-bottom: 1rem; }
		.top-aisatsu__img     { width: auto; max-width: 500px; border-radius: 20px; }
		.top-aisatsu__body    { padding-left: 150px; padding-right: 120px; }
		.top-aisatsu__license { line-height: 20pt; font-size: inherit; }
		.top-aisatsu__text    { font-size: 14pt; line-height: 28pt; padding-top: 10px; }
		.top-aisatsu__more    { padding-top: 1rem; padding-bottom: 1rem; }
		.top-aisatsu__more img { width: auto; max-width: 90px; }

		.top-yoyaku__title    { width: auto; max-width: 250px; }
		.top-yoyaku__head     { padding-bottom: 3rem; }
		.top-yoyaku__icons     { position: static; }
		.top-yoyaku__kyushin   { position: static; width: auto; padding-top: 1.5rem; }
		.top-yoyaku__kyushin img   { max-width: 100px; }
		.top-yoyaku__madoguchi { text-align: right; padding-top: 1.5rem; }
		.top-yoyaku__madoguchi img { width: auto; max-width: 180px; margin-left: auto; }
		.top-yoyaku__table    { padding-right: 30px; }
		.top-yoyaku .yoyaku-th-time { font-size: 11pt; }
		.top-yoyaku .yoyaku-td-note { font-size: 9pt; line-height: normal; }
		.top-yoyaku table     { font-size: 11pt; }

		.top-address__map #map { width: 70%; }
		.top-address__title   { max-width: 100px; }
	}

	/* ============================================
	   共通パーツ: アクセス・地図・所在地
	   （_part_access.php / clinic・first で共用）
	   ============================================ */
	.part-access { padding-top: 30px; }
	.part-access__map { width: 95%; margin: 0 auto; }
	.part-access__info { text-align: center; }
	.part-access__title-wrap { width: 30%; padding-top: 30px; margin: 0 auto; }
	.part-access__title { max-width: 80px; }

	@media (min-width: 992px) {
		.part-access {
			padding-top: 10px;
			padding-left: 50px;
			padding-right: 50px;
			padding-bottom: 20px;
		}
		.part-access__info { text-align: left; }
		.part-access__map { width: 80%; }
		.part-access__title-wrap { width: auto; max-width: 100px; }
		.part-access__title { max-width: 100%; }
	}

	/* ============================================
	   トップページ: お知らせ / コンセプト（PC/SP共通化）
	   ============================================ */

	/* ---------- お知らせ ---------- */
	/* 投稿は6件取得し、スマートフォンでは先頭2件のみ表示する */
	.top-news        { background-color: #FCF2D3; }
	.top-news__head  { padding-bottom: 1.5rem; }
	.top-news__title { width: 70%; }
	.top-news__body  { padding-left: 0; }
	.top-news__item:nth-child(n+3) { display: none; }
	.top-news__more     { padding-top: 1rem; }
	.top-news__more img { width: 30%; margin: 0 auto 20px; }

	/* ---------- コンセプト ---------- */
	.top-concept        { background-color: #FCFBEF; padding-top: 10px; }
	.top-concept__title { width: 70%; }
	.top-concept__head  { padding-top: 1rem; }
	.top-concept__item  { padding-top: 1rem; }
	.top-concept .conceptpc_title { font-size: 13pt; }

	/* コンセプトの見出しを中央ぞろえにする（PC・SP共通）。
	   .conceptpc_title は inline-block（下線を文字幅に合わせるため）なので、
	   親を text-align: center にし、本文だけ左ぞろえに戻す。
	   見出しは .row の外（.top-concept__item 直下）に置いているため、
	   PCで「詳しくはこちら」ボタン列を含めた全体幅の中央に来る。 */
	.top-concept__item            { text-align: center; }
	.top-concept .conceptpc_body  { padding-left: 10px; text-align: left; }
	.top-concept__more img { width: 20%; margin: 0 auto 20px; }

	@media (min-width: 992px) {

		.top-news        { background-color: #FFFFFF; padding-top: 1rem; }
		.top-news__head  { padding-top: 1rem; padding-bottom: 0; }
		.top-news__title { width: auto; max-width: 350px; }
		.top-news__list  { padding-top: 3rem; }
		/* PCは6件すべて表示 */
		.top-news__item:nth-child(n+3) { display: block; }
		.top-news__icon img { max-width: 90px; }
		.top-news__body     { color: #979797; text-align: left; font-size: 12pt; }
		.top-news__more     { padding-top: 3rem; }
		.top-news__more img { width: auto; max-width: 150px; }

		.top-concept        { background-color: #FFFFFF; padding-top: 1rem; }
		.top-concept__title { width: auto; max-width: 350px; }
		.top-concept__item  { padding-top: 3rem; padding-left: 8.333%; padding-right: 8.333%; }
		.top-concept .conceptpc_title { font-size: 14pt; }
		.top-concept .conceptpc_body  { padding-left: 0; }
		/* 見出しを行の外に出した分（見出し高さ+余白=52px）を差し引き、
		   ボタンの縦位置を変更前と同じに保つ */
		.top-concept__btn   { padding-top: 48px; }
		.top-concept__btn img { max-width: 200px; }
	}

	/* ============================================
	   共通パーツ: 執筆・監修者ボックス
	   （_part_author.php / 医療情報ページに自動表示）
	   ============================================ */
	.author-box { background-color: #FFFFFF; padding-top: 30px; padding-bottom: 20px; }

	.author-box__inner {
		border: 1px solid #CDC5A9;
		border-radius: 8px;
		background-color: #FCFBEF;
		padding: 18px;
	}

	.author-box__head {
		display: inline-block;
		background-color: #CDC5A9;
		color: #FFFFFF;
		font-size: 10pt;
		padding: 3px 16px;
		border-radius: 4px;
		margin-bottom: 14px;
	}

	.author-box__body { display: flex; align-items: flex-start; }
	.author-box__photo { flex: 0 0 76px; margin-right: 12px; }
	.author-box__photo img { border-radius: 6px; }
	.author-box__text { flex: 1 1 auto; min-width: 0; color: #AE9E84; }

	.author-box__name {
		font-size: 13pt;
		font-weight: bold;
		color: #8A7B62;
		margin: 0 0 4px;
		line-height: 1.4;
	}
	.author-box__honorific { font-size: 10pt; font-weight: normal; }

	.author-box__affil { font-size: 10pt; margin: 0 0 8px; line-height: 1.5; }

	.author-box__cred { list-style: none; padding-left: 0; margin: 0 0 10px; font-size: 9.5pt; }
	.author-box__cred li {
		position: relative;
		padding-left: 1em;
		line-height: 1.7;
		/* 「専門医」などの語が途中で改行されないようにする */
		word-break: keep-all;
		overflow-wrap: anywhere;
	}
	.author-box__cred li::before { content: "・"; position: absolute; left: 0; }

	.author-box__link { margin: 0; font-size: 10pt; }
	.author-box__link a { color: #EDAA68; text-decoration: underline; }

	.author-box__updated {
		margin: 14px 0 0;
		font-size: 9pt;
		color: #AE9E84;
		text-align: right;
	}

	@media (min-width: 992px) {
		.author-box__inner { padding: 26px 30px; }
		.author-box__photo { flex: 0 0 140px; margin-right: 24px; }
		.author-box__name { font-size: 16pt; }
		.author-box__honorific,
		.author-box__affil,
		.author-box__cred,
		.author-box__link { font-size: 11pt; }
		.author-box__cred li { word-break: normal; }
		.author-box__updated { font-size: 10pt; }
	}

	/* PCサイドバーのロゴを h1 にしたことによる既定マージンの打ち消し
	   （SPヘッダー側の h1.text-center も同様） */
	.site-logo-pc { margin: 0; line-height: 0; }
	.site-logo-sp { margin: 0; }


	/* ============================================
	   見出しの h タグ化に伴う調整

	   div → h3 / h4 / h5 にしたことで、Bootstrap の
	   h1–h6 { font-weight:500; line-height:1.2; margin-bottom:.5rem }
	   や mystyle.css の h4 ルール（font-weight:400）が当たるため、
	   変更前と同じ見え方に戻している。
	   ============================================ */
	.main_head,
	.midashi_title,
	.main_title,
	.main_subtitle,
	.main_subtitle1,
	.main_subtitle2,
	.main_subtitle3 {
		font-weight: 500;
		line-height: inherit;
		/* style2.css の h1–h6 { font-family: "Raleway" } を打ち消す。
		   Raleway は欧文専用のため、数字・英字・記号だけが本文と
		   違う書体で表示されてしまう。 */
		font-family: inherit;
	}

	.main_subtitle,
	.main_subtitle1,
	.main_subtitle3 {
		margin-top: 0;
		margin-bottom: 0;
	}

	/* 診察案内の疾患アイコン（画像のみのブロック）を h2 にしたため、
	   Bootstrap の h2 { margin-bottom:.5rem; line-height:1.2 } を打ち消す。
	   align="center" が div では -webkit-center、見出しでは center に
	   なるため、元の挙動に合わせて指定し直している。 */
	.sec_head {
		margin-top: 0;
		margin-bottom: 0;
		line-height: inherit;
		text-align: -webkit-center;
	}

	/* .main_subtitle3 は font-size と padding の指定が無いため、
	   h5 の 1.25rem と、h4 タグの padding(20px/10px) を打ち消す */
	.main_subtitle3 {
		font-size: inherit;
		padding-top: 0;
		padding-bottom: 0;
	}

	.main_subtitle2 {
		margin-top: 0;
		margin-bottom: 0;
		/* 旧 <u>（border-bottom: #F6AE6A 1.5px solid）を
		   文字下線として再現する。<u> が無くなっても線は残る。 */
		text-decoration: underline;
		text-decoration-color: #F6AE6A;
		text-decoration-thickness: 1px;
		text-underline-offset: 0.12em;
	}

	/* ============================================
	   クリニック概要テーブル（スマートフォン）

	   左右の余白（col-2）を外して全幅にしたうえで、
	   項目名の列を内容幅に固定し、値の列を最大化する。
	   横スクロールにすると内容が隠れてしまうため採用していない。
	   ============================================ */
	@media (max-width: 991.98px) {
		.part-gaiyou table td:first-child {
			width: 1%;
			white-space: nowrap;
		}
	}

	/* お知らせのアイキャッチをリンク化した際、インライン要素のままだと
	   クリック範囲が文字高さ分しか確保されないため、画像全体を
	   押せるように inline-block にする */
	.top-news__icon a {
		display: inline-block;
		line-height: 0;
	}