@charset "shift_jis";
html {
    min-width: 320px;
}
body.active{
	overflow: hidden;
}
.br_sp{
	display: block;
}
.sp_hide{
	display: none !important;
}
.pc_hide{
	display: block !important;
}
header{
	z-index: 9999;
}
header h1 {
    text-align: center;
    padding: 12px 45px 10px 5px;
    line-height: 1;
    font-size: 1.125rem;
    letter-spacing: 1.6px;
	color: #FFF;
}
header.active,
header.active.UpMove,
header.active.DownMove {
    top: 0;
}
header.active{
	background-color: #3D468E;
	box-shadow: none;
}
header #menu_btn a {
    top: 0;
    bottom: 0;
    left: auto;
    right: 19px;
    margin: auto;
    padding-left: 0;
    width: 28px;
    overflow: hidden;
    text-indent: -9999px;
}
header #menu_btn a img {
    width: 100px;
    display: none;
}
header #menu_btn a:before,
header #menu_btn a:after {
    width: 100%;
    top: 0;
}
header #menu_btn a:before {
    height: 8px;
    border-top-width: 2px;
    border-bottom-width: 2px;
}
header #menu_btn a:after {
    height: 2px;
}
nav {
    height: 100%;
	width: 100%;
    top: 30px;
    bottom: auto;
    transform-origin: top left;
}
nav #nav_cnt {
    flex-direction: column;
    padding: 67px 30px 67px 51px;
    justify-content: flex-start;
	gap:13px;
}

nav #close_btn {
    display: none;
}
nav.active + .nav_bg,
.nav_list:first-child p {
    display: none;
}
nav #nav_cnt .nav_list {
    width: auto;
}
nav #nav_cnt .nav_list p {
    margin: 27px 0 9px;
}
nav #nav_cnt .nav_list:nth-child(2) p {
    margin: 19px 0 15px;
}
nav #nav_cnt .nav_list:nth-child(2) p::before,
nav #nav_cnt .nav_list:nth-child(2) p::after,
nav #nav_cnt .nav_list:nth-child(3) p::before,
nav #nav_cnt .nav_list:nth-child(3) p::after {
    color: #FFFFFF;
}
nav #nav_cnt .nav_list:nth-child(2) p::before,
nav #nav_cnt .nav_list:nth-child(3) p::before,
nav #nav_cnt .nav_list:nth-child(3) p::after{
    font-size: 18px;
    letter-spacing: 1.8px;
}
nav #nav_cnt .nav_list:nth-child(3) p::after{
	margin-left: -7px;
}
nav #nav_cnt .nav_list:nth-child(2) p::after{
	font-size: 14px;
    margin-left: -2px;
    letter-spacing: 0;
}
nav #nav_cnt .nav_list:nth-child(2) p::before {
    content: "»‘¢Œ³";
}
nav #nav_cnt .nav_list:nth-child(2) p::after {
    content: "s¼–{‹àŒ^Š”Ž®‰ïŽÐt";
}
nav #nav_cnt .nav_list p img {
    display: none;
}
nav #nav_cnt .nav_list:nth-child(2) ul{
    margin-left: 21px;
}
nav #nav_cnt .nav_list ul li {
    margin: 0 0 11.5px;
}
nav #nav_cnt .nav_list:nth-child(2) ul li{
    margin-bottom: 7px;
}
nav #nav_cnt .nav_list:nth-child(3){
	margin-left: 0;
    margin-top: 33px;
}
nav #nav_cnt .nav_list:nth-child(3) p {
    margin: 10px 0;
}
nav #nav_cnt .nav_list ul li a {
    font-size: 18px;
	letter-spacing: 1.5px;
}
nav #nav_cnt .nav_list:nth-child(2) ul li a,
nav #nav_cnt .nav_list:nth-child(3) ul li a {
    font-size: 18px;
    letter-spacing: 0;
}
nav #nav_cnt .nav_list:nth-child(2) ul li a{
	letter-spacing: 1px;
}
.nav_list:nth-child(3) ul {
    margin-left: 47px;
}
#menu_btn.active img {
    opacity: 0;
}
#menu_btn a:before,
#menu_btn a:after {
    transition: all 0.6s;
}
#menu_btn.active a:before {
    transform: rotate(25deg);
    border: none;
    background-color: #FFF;
    height: 2px;
}
#menu_btn.active a:after {
    height: 2px;
    transform: rotate(155deg);
}
/* Youtube“®‰æ
.youtube {
    width: 100%;
    margin-bottom: 48px;
    padding: 0;
}
.youtube_wrap {
    width: 100%;
    position: relative;
    display: block;
    height: 0;
    padding-bottom: 56.25%;
    overflow: hidden;
}
.youtube_wrap iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
} */

#main_visual {
    padding: 77px 0 0;
}
#main_visual:before{
	height: 96%;
}
#main_visual h2{
	font-size: 1.9375rem;
	letter-spacing: 2.3px;
	line-height: 1.5;
	padding-left: 2.3px;
}
#main_visual h2 span{
	font-size: 2.59375rem;
}
#main_visual h2 span::before {
    left: 14px; 
	font-size: 2rem;
}
#main_visual h2 span.ps::before{
    left: 9px;
}
#main_visual p.sub_ttl{
	font-size: 1.5rem;
	letter-spacing: 1.5px;
	margin-top: 6px;
	padding-left: 1.5px;
}
#main_visual .mv_cnt{
    margin: 34px auto 0;
    flex-direction: column;
}
#main_visual .mv_cnt > div{
	max-width: inherit;
}
#main_visual .text{
	font-size: 1.25rem;
    text-align: center;
    letter-spacing: 1.5px;
	padding-left: 1.5px;
    margin-top: -3px;
	line-height: 1.5;
}
#main_visual .mv_cnt .img_cnt{
	display: flex;
	max-width: 273px;
	margin: 28px auto 0;
	gap:14px;
	align-items: flex-end;
}
#main_visual .mv_cnt .img_cnt img{
	max-width: 120px;
	margin-bottom: 5px;
}
#main_visual .job{
	font-size: 1.25rem;
    margin-top: 0;
    letter-spacing: 1.6px;
	padding-bottom: 5px;
}
#main_visual .job span{
	font-size: 1rem;	
}
#main_visual .name{
	font-size: 1.25rem;
	letter-spacing: 2.2px;
	margin-top: 4px;
}
#main_visual .name span{
    font-size: 1rem;
    vertical-align: 1px;
    margin-left: -2px;
}
#main_visual .main_img{
	margin-top: 21px;
    padding: 0px 18px;
}

.sub_txt{
	padding: 8px 30px 8px 31px;
	margin-bottom: 50px;	
}
.sub_txt h2,
.sub_txt p{
	font-size: 1.75rem;
	letter-spacing: 1px;
}
h3{
	font-size: 1.5rem;
	letter-spacing: 1px;
	padding-left: 1px;
    padding-bottom: 18px;
	margin-bottom: 24px;
	margin-top: 53px;
}
.contents_inner p{
	letter-spacing: 0;
    font-size: 1rem;
}

.two_column{
	gap:20px;
	flex-direction: column;
}
.two_column > div{
	max-width: inherit;
}
.two_column > div.text{
	max-width: inherit;	
}

#cnt01 .contents_inner{
    padding: 0 30px 80px;
}
#cnt01 .manga_btn{
	margin-bottom: 50px;
}
#cnt01 .manga_btn a{
	border-radius: 100px;
	padding: 20px 30px 65px;
	max-width: 365px;
}
#cnt01 .manga_btn a p:first-child{
	font-size: 1rem;
	letter-spacing: 3px;
    padding: 0 20px;
	line-height: 1.3;
}
#cnt01 .manga_btn a p:first-child:before{
	background: url("../images/oral_frail/btn_img3.svg") top left/10px 24px no-repeat;
	width: 10px;
	height: 24px;
}
#cnt01 .manga_btn a p:first-child:after{
	background: url("../images/oral_frail/btn_img3.svg") top left/10px 24px no-repeat;
	width: 10px;
	height: 24px;
    right: 6px;
}
#cnt01 .manga_btn a p:last-child{
	font-size: 1.25rem;
	letter-spacing: 2px;
	line-height: 1;
	margin-top: 5px;
}
#cnt01 .manga_btn a:before{
	background: url("../images/oral_frail/btn_img1.svg") top left/50px 50px no-repeat;
	width: 50px;
	height: 50px;
	left: 60px;
	top:inherit;
	bottom:8px;
}
#cnt01 .manga_btn a:after{
	background: url("../images/oral_frail/btn_img2.svg") top left/50px 50px no-repeat;
	width: 50px;
	height: 50px;
	right: 60px;
	top:inherit;
	bottom:8px;
}
#cnt01 ul li{
    letter-spacing:0;
    font-size: 1rem;
    padding-left: 17px;
}
#cnt01 ul li::before{
    top: 8px;
    width: 13px;
    height: 13px;
}
#cnt01 .two_column > div.img{
	margin-top: 0;
}

#cnt02{
	padding-bottom: 80px;
}
#cnt02 .cnt_ttl,
#cnt03 .cnt_ttl,
#cnt04 .cnt_ttl,
#cnt05 .cnt_ttl{
	font-size: 1.75rem;
	letter-spacing: 1px;
    padding: 8px 30px 8px 31px;
}
#cnt02 .contents_inner{
	margin-top: 50px;
	padding: 0 30px;
}
#cnt02 .two_column{
	margin: 10px 0 20px;
}
#cnt03{
    padding: 0 0 80px;
}
#cnt03 .contents_inner{
	margin-top: 50px;
	padding: 0 30px;
}
#cnt03 .idea_list{
	margin: 30px 0 50px;	
    gap: 30px;
}
#cnt03 .idea_list > div{
	gap:20px;
    flex-direction: column;
}
#cnt03 .idea_list p.midashi{
	font-size: 1.25rem;
	letter-spacing: 2px;
	padding: 8px 25px 4px 27px;
	max-width: inherit;
}
#cnt03 .img_cnt1{
	margin: 10px 0 20px;
}
#cnt03 .img_cnt2{
	margin: 10px 0 20px;
    gap: 20px;
}
#cnt03 .source_list{
	margin-top: 50px;
    padding: 20px 0 20px;
}
#cnt03 .source_list > div{
	flex-direction: column;
}
#cnt03 .source_list li,
#cnt03 .source_list p{
	font-size: 0.875rem;
}
#cnt04{
    padding: 0 0 80px;
}
#cnt04 .contents_inner{
	margin-top: 50px;
	padding: 0 30px;
}
#manga_box .tab_box{
	margin:0 auto 30px;
	max-width: 550px;
}

#manga_box .tab_box .acdn_ttl {
    padding: 17px 60px 17px 20px;
    min-height: inherit;
	gap: 0 15px;
	flex-wrap: wrap;
}
#manga_box .tab_box .acdn_ttl .img{
	max-width: 50px;
	line-height: 0;
}
#manga_box .tab_box .acdn_ttl p img{
	max-height: 60px;
}
#manga_box .tab_box .acdn_ttl:after{
	background: url("../images/oral_frail/manga_icon.svg") top left/ 25px 23px no-repeat;
	width: 25px;
	height: 23px;
	right: 20px;
}
#manga_box .tab_box .acdn_ttl p{
	line-height: 1;
}
#manga_box .tab_box .acdn_cnt{
	padding: 20px 20px 50px;
}
#manga_box .manga{
	margin: 10px auto;
}
#cnt05 .contents_inner{
	padding: 50px 0 80px;
}
#cnt05 .cnt_ttl{
	letter-spacing: 5px;
	padding-left: 35px;
}
#cnt05 .bnr_list{
    gap: 40px;	
}
@media screen and (max-width: 370px){
	#main_visual h2 span{
		font-size: clamp(2.3rem, 11vw, 2.59375rem);
	}
	#main_visual h2 span::before {
		left: clamp(10px, 3vw, 14px);
		font-size: clamp(1.8rem, 8vw, 2rem);
    }
}