@charset "utf-8";
main .fv {
	width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	position: relative;
}

main #topics {
	position: relative;
	top: -25px;
	right: 0;
}
main #topics .inner {
	max-width: 550px;
	padding: 10px;
	background: #3e1b1a;
	border-radius: 50px 0 0 50px;
	position: absolute;
	right: 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
main #topics h3 {
	width: 104px;
	padding: 5px;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: clamp(12px,1.14vw,16px);
	font-weight: bold;
	line-height: 1em;
	color: #3e1b1a;
	text-transform: uppercase;
	border-radius: 20px;
	background: #fff;
	display: flex;
	justify-content: center;
	align-items: center;
}
main #topics a {
	width: calc(100% - 104px - 20px );
	margin: 0 10px 0 20px;
	overflow: hidden;
	display: flex;
	justify-content: flex-start;
	gap: 20px;
}
main #topics a .date,
main #topics a .title {
	font-size: clamp(12px,1.14vw,16px);
	color: #fff;
}
main #topics a .title {
	text-decoration: underline;
}
main #topics .topics_more {
	width: 60px;
	padding-left: 12px;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: clamp(9px,0.93vw,13px);
    font-weight: bold;
    color: #fff;
    text-decoration: none;
    background: left url(../images/top/to_more_icon_pc.svg) no-repeat;
    background-size: 8px;
}
@media screen and (min-width: 2001px) {
	main #topics {
		width: 100vw;
		margin-left: calc(50% - 50vw);
		margin-right: calc(50% - 50vw);
		background: #f00;
	}
	main #topics .inner {
		width: calc(550px + (100% - 2000px) / 2);
		max-width: 100%;
		justify-content: flex-start;
	}
	main #topics a {
	    width: calc(100% - 104px - 90px - (50vw - 1000px));
	}
}
@media screen and (max-width: 768px) {
	main #topics {
		top: 0;
		right: 0;
	}
	main #topics .inner {
		width: 100%;
		max-width: 100%;
		padding: 30px 10px 10px;
		background: #F0ECEA;
		border-radius: 0;
		position: static;
		flex-direction: column;
	}
	main #topics h3 {
		width: 100%;
		margin-bottom: 20px;
		padding: 0;
		font-size: 1.75em;
		color: #B3934B;
		text-transform: capitalize;
		border-radius: 0;
		background: none;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	main #topics a {
		width: 100%;
		margin: 0 0 10px;
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
		gap: 0;
	}
	main #topics a .date,
	main #topics a .title {
		color: #545454;
	}
	main #topics a .date {
		font-size: 0.75em;
	}
	main #topics a .title {
		text-decoration: none;
	}
	main #topics .topics_more {
		width: auto;
		margin-left: auto;
		padding-left: 15px;
		font-size: 0.813em;
	    color: #B3934B;
	    background: left url(../images/top/to_more_icon_s.svg) no-repeat;
    	background-size: 10px;
	}
}

main #greeting {
	background-image: url("../images/top/top_greeting_doctor_pc.png"), url("../images/top/top_greeting_bg.svg");
	background-repeat: no-repeat, repeat;
	background-size: contain, auto;
}
main #greeting .inner {
	width: 100%;
	max-width: 1400px;
	margin: 0 auto;
	padding: 50px 20px 30px;
	display: flex;
	justify-content: flex-end;
}
main #greeting .txtarea {
	width: 50%;
	display: flex;
	flex-direction: column;
	gap: 30px;
}
main #greeting h3 {display: none;}
main #greeting .heading {
	font-family: "Klee One", system-ui, "YuGothic", sans-serif;
	font-size: clamp(20px,2vw,28px);
	letter-spacing: 0.1em;
	line-height: 1.9;
}
main #greeting .txt {
	margin-bottom: 0;
	font-size: clamp(12px,1.14vw,16px);
}
main #greeting .name {
	margin-bottom: 0;
	font-size: clamp(12px,1.14vw,16px);
	text-align: right;
}
@media screen and (max-width: 768px) {
	main #greeting {
		background-image: url("../images/top/top_greeting_bg.svg");
		background-repeat: repeat;
		background-size: 220%;
	}
	main #greeting .inner {
		padding: 0;
		background: none;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		align-items: center;
	}
	main #greeting .txtarea {
		width: 100%;
		padding: 15px 10px;
		gap: 20px;
	}
	main #greeting h3 {
		font-size: 1.125em;
		line-height: 1.9;
	}
	main #greeting .txt {
		line-height: 1.4;
	}
	main #greeting .name {
		font-size: 1em;
		text-align: right;
	}
}

main #subject .blue_radical {
	background: url("../images/top/top_blue_img_bg_pc.png") #fff no-repeat;
	background-size: auto 100%;
	background-position: right top;
}
main #subject .preventive {
	background: url("../images/top/top_preventive_img_bg_pc.png") #fff no-repeat;
	background-size: auto 100%;
	background-position: left top;
}
main #subject .inner {
	width: 100%;
	max-width: 1320px;
	margin: 0 auto;
	padding: 50px 40px 30px;
	display: flex;
}
main #subject .inner .hd_img {
	display: none;
}
main #subject .blue_radical .inner {justify-content: flex-start;}
main #subject .preventive .inner {justify-content: flex-end;}
main #subject .inner img {display: nonek;}
main #subject .txtarea {
	width: 550px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
main #subject .blue_radical .txtarea {
	margin-left: 5%;
}
main #subject .preventive .txtarea {
	margin-right: 5%;
}
main #subject h2 {
	font-weight: bold;
	font-size: clamp(34px,2.86vw,40px);
}
main #subject .blue_radical h2 {
	color: #337C8B;
}
main #subject .preventive h2 {
	 color: #b3934b;
}
main #subject h2 img {display: block;}
main #subject h3 {
	font-weight: bold;
	font-size: clamp(16px,1.43vw,20px);
	color: #3e1b1a;
}
main #subject .txt {
	margin-bottom: 0;
	font-size: clamp(12px,1.14vw,16px);
}
main #subject .images ul {
	margin-top: 10px;
	display: flex;
	justify-content: space-between;
}
main #subject .images li img{
	border-radius: 20px;
	
}
main #subject .txt_btn a {
	margin: 10px auto;
}
@media screen and (max-width: 1280px) {
	main #subject .inner,
	main .yobou .inner {
		padding: 50px 0 30px
	}
	main #subject .txtarea,
	main .yobou .txtarea {
    width: 45%;
	}
	main .images ul {
		gap: 10px;
	}
	main #features .inner {
		padding: 40px 0px 0 30px;
		top: 5%;
		gap: 10px;
	}
	main #features .txt {
    	width: 45%;
	}
}
@media screen and (max-width: 1023px) {
	main #subject {
		background: none !important;
	}
	main #subject .inner {
		padding: 0;
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
	}
	main #subject .inner .hd_img {display: block;}
	main #subject .txtarea {
		width: 100%;
		padding: 10px;
		gap: 10px;
	}
	main #subject .blue_radical,
	main #subject .preventive {
		background: none;
	}
	
	main #subject .blue_radical .txtarea {
		margin-left: 0;
	}
	main #subject .preventive .txtarea {
		margin-right: 0;
	}
	main #subject h2 {
		margin: 20px auto 10px;
		font-size: 1.875em;
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	main #subject .blue_radical h2 img {
		width: 174px;
	}
	main #subject .preventive h2 img {
		width: 128px;
	}
	main #subject h3 {
		font-family: "Hiragino Mincho ProN", "ヒラギノ明朝 ProN W6", "Hiragino Mincho Pro", "ヒラギノ明朝 Pro W6", serif;
		font-size: 1.125em;
		text-align: center;
	}
	main #subject .txt {
		margin-bottom: 0;
		font-size: 1em;
	}
	main #subject .images {display: none;}
	main #subject .txt_btn a {
		margin: 20px auto;
	}
}

main #treatment {
	background: #f0ecea;
	position: relative;
}
main #treatment .inner {
	width: 100%;
	max-width: 1920px;
	margin: 0 auto;
	padding: 40px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 20px;
}
main #treatment h2,
main #kidzania h2 {
	font-size: clamp(8px,0.86vw,12px);
	font-weight: normal;
	line-height: 1.4;
	text-align: center;
	color: #b3934b;
	position: relative;
}
main #treatment h2 span,
main #kidzania h2 span {
	font-family: "Klee One", system-ui, "YuGothic", sans-serif;
	font-size: clamp(26px,2.14vw,30px);
	color: #3e1b1a;
	display: block;
}
main #treatment h2:before,
main #kidzania h2:before {
	width: 4px;
	height: 46px;
	margin-bottom: 5px;
	content: "";
	background: url("../images/common/h2_bg.svg") no-repeat;
	display: block;
	position: relative;
	top: 0;
	left: 50%;
}
main #treatment p {
	text-align: center;
}
main #treatment ul {
	margin-bottom: 20px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 40px 0;
}
main #treatment li {
	width: calc(100% / 4 - 30px );
	box-shadow: 10px 10px 0 0px rgba(225, 217, 213, 1);
}
main #treatment li a {
	width: 100%;
	padding: 30px;
	font-size: clamp(5px,0.64vw,9px);
	color: #b3934b;
	display: block;
}
main #treatment li a span {
	font-family: "Klee One", system-ui, "YuGothic", sans-serif;
	font-size: clamp(18px,1.57vw,22px);
	color: #3e1b1a;
	display: block;
}
main #treatment li.treatment_1 a {
	background: url("../images/top/treatment_menu_icon_1.svg") #fff no-repeat;
	background-size: 50px 61px;
	background-position: 90% 50%;
}
main #treatment li.treatment_2 a {
	background: url("../images/top/treatment_menu_icon_2.svg") #fff no-repeat;
	background-size: 77px 45px;
	background-position: 90% 50%;
}
main #treatment li.treatment_3 a {
	background: url("../images/top/treatment_menu_icon_3.svg") #fff no-repeat;
	background-size: 67px 68px;
	background-position: 90% 50%;
}
main #treatment li.treatment_4 a {
	background: url("../images/top/treatment_menu_icon_4.svg") #fff no-repeat;
	background-size: 59px 50px;
	background-position: 90% 50%;
}
main #treatment li.treatment_5 a {
	background: url("../images/top/treatment_menu_icon_5.svg") #fff no-repeat;
	background-size: 40px 55px;
	background-position: 90% 50%;
}
main #treatment li.treatment_6 a {
	background: url("../images/top/treatment_menu_icon_6.svg") #fff no-repeat;
	background-size: 74px 62px;
	background-position: 90% 50%;
}
main #treatment li.treatment_7 a {
	background: url("../images/top/treatment_menu_icon_7.svg") #fff no-repeat;
	background-size: 40px 70px;
	background-position: 90% 50%;
}
main #treatment li.treatment_8 a {
	background: url("../images/top/treatment_menu_icon_8.svg") #fff no-repeat;
	background-size: 57px 50px;
	background-position: 90% 50%;
}
@media screen and (max-width: 1023px) {
	main #treatment ul {
		justify-content: flex-start;
		gap: 40px;
	}
	main #treatment li {
		width: calc(100% / 3 - 30px );
	}	
}
@media screen and (max-width: 768px) {
	main #treatment {}
	main #treatment .inner {
		padding: 30px 10px 40px;
		gap: 20px;
	}
	main #treatment h2,
	main #kidzania h2,
	main #information h2,
	#primary h2.entry-title {
		font-size: 0.75em;
		line-height: 1.5;
	}
	main #treatment h2 span,
	main #kidzania h2 span,
	main #information h2 span,
	#primary h2.entry-title span {
		font-size: 2.35em;
	}
	main #treatment h2:before,
	main #kidzania h2:before,
	main #information h2:before,
	#primary h2.entry-title:before {
		height: 36px;
		margin-bottom: 0;
	}
	main #treatment p {
		text-align: left;
	}
	main #treatment ul {
		margin-bottom: 0;
		padding-right: 5px;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		gap: 15px 0;
	}
	main #treatment li {
		width: calc(100% / 2 - 5px );
		box-shadow: 5px 5px 0 0px rgba(225, 217, 213, 1);
	}
	main #treatment li a {
		width: 100%;
		padding: 10px;
		padding-top: calc(10px + 25%);
		font-size: 0.75em;
		text-align: center;
	}
	main #treatment li a span {
		font-size: 1.8em;
	}
	main #treatment li.treatment_1 a {
		background-size: 32px 39px;
		background-position: 50% 20%;
}
	main #treatment li.treatment_2 a {
		background-size: 49.5px 29px;
		background-position: 50% 25%;
	}
	main #treatment li.treatment_3 a {
		background-size: 43px 44px;
		background-position: 50% 20%;
	}
	main #treatment li.treatment_4 a {
		background-size: 38px 32px;
		background-position: 50% 25%;
	}
	main #treatment li.treatment_5 a {
		background-size: 25.5px 35.5px;
		background-position: 50% 25%;
	}
	main #treatment li.treatment_6 a {
		background-size: 47.5px 40px;
		background-position: 50% 20%;
	}
	main #treatment li.treatment_7 a {
		background-size: 26px 39.5px;
		background-position: 50% 20%;
	}
	main #treatment li.treatment_8 a {
		background-size: 37px 32px;
		background-position: 50% 20%;
	}
}

main #features {
	width: 100%;
	height: 0;
	padding-top: 70.3%;
    background-image: url("../images/top/features_img_bg_pc.png");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	position: relative;
}
main #features .inner {
	width: 100%;
	height: calc(100% - 60px);
	max-width: 1320px;
	margin: 0 auto;
	padding: 40px 40px 0 40px;
	position: absolute;
	top: 10%;
	left: 0;
	right: 0;
	display: flex;
	flex-direction: column;
	gap: 20px;
}
main #features .inner img {display: none;}
main #features h2 {
	font-size: clamp(32px,2.57vw,36px);
	color: #b3934b;
	position: relative;
}
main #features h3 {
	font-family: "Klee One", system-ui, "YuGothic", sans-serif;
	font-size: clamp(18px,1.57vw,22px);
	line-height: 1.75;
	color: #3e1b1a;
}
main #features .txt {
	width: 505px;
}
main #features .txt_btn {
	position: absolute;
	right: 0;
	bottom: 40px;
	left: 0;
}
main #features .txt_btn a {
	margin: 0 auto;
}
@media screen and (max-width: 1023px) {
	main #features {
		width: 100%;
		height: auto;
		padding-top: 0;
		padding-bottom: 30px;
		background-image: none;
		background-color: #fff;
		position: static;
	}
	main #features .inner {
		padding: 0 10px 10px;
		position: static;
		gap: 10px;
	}
	main #features .inner img {display: block;}
	main #features h2 {
		font-size: 1.875em;
		text-align: center;
	}
	main #features h3 {
		font-size: 1.125em;
	}
	main #features .txt {
		width: 100%;
	}
	main #features .txt_btn {
		position: relative;
		bottom: 0;
	}
}

main #kidzania {
	width: 100%;
	margin: 0 auto;
	aspect-ratio: 5 / 1;
	background: #f0ecea;
	clip-path: polygon(50% 0%, 100% 30%, 100% 100%, 0% 100%, 0% 30%);
}
main #kidzania .bg_box {
	width: 100%;
}
main #kidzania .inner {
	width: 100%;
	max-width: 1320px;
	margin: 0 auto;
	padding: 80px 40px;
}
main #kidzania p {
	margin-top: 50px;
	text-align: center;
}
main #kidzania .kidzania_slide {
	width: calc(100% - 100px);
	margin: auto;
}
main #kidzania .kidzania_slide .slick-list {
    padding: 0 50px 0 0 !important;
}
main #kidzania .kidzania_slide .slick-slide {
    margin: 0 10px 0 0;
}
main #kidzania .kidzania_slide .slick-slide img {
	height: 100%;
	border-radius: 40px;
}
@media screen and (max-width: 768px) {
	main #kidzania {
	    clip-path: polygon(50% 0%, 100% 15%, 100% 100%, 0% 100%, 0% 15%);
	}
	main #kidzania .inner {
		padding: 80px 40px 40px;
	}
	main #kidzania p {
		width: 100vw;
	    margin-top: 30px;
		margin-left: calc(50% - 50vw);
		padding: 0 10px;
    	text-align: left;
	}
	main #kidzania .kidzania_slide {
    	width: calc(100% - 10px);
	}
	main #kidzania .kidzania_slide .slick-list {
    	padding: 0 80px 0 0 !important;
	}
	main #kidzania .kidzania_slide .slick-slide img {
		border-radius: 10px;
}
}
@media screen and (max-width: 480px) {
	main #kidzania .kidzania_slide .slick-slide {
		margin: 0 5px 0 0;
	}
}

main #announcement {}
main #announcement .inner {
	display: flex;
	align-items: stretch;
}
main #announcement .news {
	width: calc(100% / 3);
	padding: 30px 40px;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: center;
	background: #fff;
}
main #announcement .news h2 {
	width: 100%;
	padding-right: 76px;
	font-size: clamp(16px,1.43vw,20px);
	font-weight: normal;
	color: #3e1b1a;
	background: url("../images/top/topics_icon.svg") no-repeat;
	background-size: 64px 46px;
	background-position: 132px 50%;
}
main #announcement .news h2 span {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: clamp(28px,2.29vw,32px);
	font-weight: bold;
	color: #b3934b;
	display: block;
}
main #announcement .news .news_content {
    width: 100%;
    padding: 10px 0;
}
main #announcement .news .news_content ul {
    border-bottom: 1px solid #bcbdbd;
}
main #announcement .news .news_content  li {
    border-top: 1px solid #bcbdbd;
    padding: 15px 10px;
}
@media screen and (max-width: 1240px) {
	main #announcement .news {
		padding: 10px 40px;
	}
	main #announcement .news .news_content  li {
		padding: 10px 10px;
	}
}

main #announcement .news .news_content .post-date {
	font-size: clamp(10px,1vw,14px);
	color: #7e7473;
    display: block;
}
main #announcement .news .news_content li a {
	color: #3e1b1a;
}
main #announcement .news .txt_btn {
    margin: auto auto 0;
}

main #announcement ul.links {
	width: calc(100% - (100% / 3));
	display: flex;
}
main #announcement .links li {
	width: 50%;
	height: 0;
	padding-top: calc(83.54% / 2);
	position: relative;
	display: flex;
}
main #announcement .links li a {
	width: 100%;
	height: 100%;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: clamp(32px,2.57vw,36px);
	font-weight: bold;
	color: #fff;
	position: absolute;
	top: 0;
	left: 0;
	display: flex;
	justify-content: center;
	align-items: center;
}
main #announcement .links li.garelly a {
	background: url("../images/top/bg_garelly.png") no-repeat;
	background-size: 100%;
}
main #announcement .links li.recruit a {
	background: url("../images/top/bg_recruit.png") no-repeat;
	background-size: 100%;
}
@media screen and (max-width: 1023px) {
	main #announcement .inner {
		flex-wrap: wrap;
	}
	main #announcement .news {
		width: 100%;
		padding: 20px 40px 10px;
	}
	main #announcement .news h2 {
		width: auto;
		font-size: 1em;
	}
	main #announcement .news h2 span {
		font-size: 2.25em;
	}
	main #announcement .news .txt_btn {
		width: 100%;
	}
	main #announcement .news .txt_btn a {
		margin: 20px auto;
	}
	main #announcement ul.links {
		width: 100%;
	}
	main #announcement .links li a {
		font-size: 1.25em;
	}
}