@charset "utf-8";
@import url("reset.css");
/*--京base.css--*/
html {}

body {
	width: 100%;
	min-width:1000px;
	height: 100%;
	color: #000;
	font-family: "メイリオ", Meiryo,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif ;
	/*font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", Meiryo,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif ;*/
	background-color: #fff;
	font-size: 14px;
	line-height: 1.0;
}

#container{
	width: 100%;
	min-width:1000px;
	position:relative;
	z-index:1;
	padding-top: 93px;
}

/*----------header----------*/
.header {
	box-sizing: border-box;
	width: 100%;
	padding: 18px 0 12px 0;
	background: #fff;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 20;
}
.header_inner{
	min-width: 950px;
	width: 86.3vw;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.alport-syndrome-logo {}

.alport-syndrome-logo a{
	display: flex;
	flex-direction: row;
	align-items: flex-end;
	justify-content: flex-start;
	gap: var(--gap-lg);
	transition: .3s all ease;
}

.alport-syndrome-logo a:hover{
	filter: brightness(1.1);
}

.logo-galts-1-icon,
.site-title-1-icon {
	height: 63px;
	position: relative;
	object-fit: cover;
	z-index: 1;
}
.site-title-1-icon {
	height: 54px;
	mix-blend-mode: normal;
}

.icon-ext-link-1 {
	height: 15px;
	position: relative;
	object-fit: cover;
}


.nav_link{}

.header_link{
	margin-bottom: 20px;
}

.header_link ul{
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	justify-content: flex-end;
}

.header_link ul li{
	margin: 0 37px 0 0;
	display: flex;
	align-items: center;
}

.header_link ul li:last-child{
	margin: 0;
}

.header_link ul li a{
	font-size: 15px;
	color: #825bb8;
	text-decoration: none;
	margin-right: 0.3em;
}

.header_link ul li a:hover{
	text-decoration: underline;
}

.global_nav{}

.global_nav ul{
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	justify-content: flex-start;
}

.global_nav ul li{
	margin: 0 37px 0 0;
	display: flex;
	align-items: center;
}

.global_nav ul li:last-child{
	margin: 0;
}

.global_nav ul li a{
	font-size: 20px;
	color: #222;
	font-weight: bold;
	text-decoration: none;
	padding: 0 0.3em 6px 0.3em;
	position: relative;
	transition: .3s all ease;
}

.global_nav ul li a:hover,
.global_nav ul li.active a{
	color: #0278c2;
}

.global_nav ul li a:before{
	content:"";
	display: block;
	width: 100%;
	height: 4px;
	background: #0278c2;
	position: absolute;
	bottom: 0;
	left: 0;
	opacity: 0;
	transition: .3s all ease;
}

.global_nav ul li a:hover:before,
.global_nav ul li.active a:before{
	opacity: 1;
}

/*----------contents----------*/
.contents{}


/*-----footer-----*/
footer .box_inner{
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	align-items: center;
	width: 1000px;
	padding: 65px 0;
	margin: 0 auto;
}

footer .box_footer{
	padding: 38px 0;
	background: rgba(34, 34, 34, 0.71);
	color: #fff;
}

.rectangleframelogo {
	height: 105px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
}

.rectangleframelogo a{
	transition: .3s all ease;
}

.rectangleframelogo a:hover{
	filter: brightness(1.1);
}

.f-logo-title-1-icon {
  width: 80px;
  flex: 1;
  position: relative;
  max-height: 100%;
  object-fit: cover;
  z-index: 1;
}

.f_nav_link{
	position: relative;
}

.f_global_nav{
	margin-bottom: 28px;
}

.f_global_nav ul{
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
}

.f_global_nav ul li{
	margin: 0 3em 0.5em 0;
	display: flex;
	align-items: center;
}

.f_global_nav ul li:last-child{
	margin: 0 0 0.5em 0;
}

.f_global_nav ul li a{
	font-size: 18px;
	color: #222;
	text-decoration: none;
	padding: 0;
	position: relative;
}

.f_global_nav ul li a:hover,
.f_global_nav ul li.active a{
	color: #0278c2;
}

.footer_link{}

.footer_link ul{
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	justify-content: flex-start;
	margin-bottom: 28px;
}

.footer_link ul li{
	margin: 0 20px 0 0;
	display: flex;
	align-items: center;
}

.footer_link ul li:last-child{
	margin: 0;
}

.footer_link ul li a{
	font-size: 14px;
	color: #825bb8;
	text-decoration: none;
	margin-right: 0.3em;
}

.footer_link ul li a:hover{
	text-decoration: underline;
}

.footer_contact{
	font-size: 17px;
	text-align: left;
	line-height: 1.6;
}

.blog_btn{
	position: absolute;
    top: 6.5rem;
    right: 20rem;
}

.blog_btn a{
	display: block;
    position: relative;
    width: 80px;
    height: 80px;
}

.blog_btn a img{
	transition: .5s all ease;
    position: absolute;
    top: 0;
    left: 0;
    display: block;
}

.blog_btn a img[src*="_on"]{
	transform:rotateY(180deg);
	opacity:0;
}

.blog_btn a:hover img[src*="_off"]{
	transform:rotateY(180deg);
	opacity:0;
}

.blog_btn a:hover img[src*="_on"]{
	transform:rotateY(0deg);
	opacity:1;
}

.copyright{
	text-align: center;
}

/*-----nav_oc-----*/
.nav_oc{
    /*display: block;*/
    display: none;
    width: 100px;
    height: 100px;
    position: fixed;
    top: 0;
    right: 0;
    z-index: 10;
    transition: .3s all ease;
}

    .menu-trigger{
        width: 100%;
        height: 100%;
        padding: 0;
        border: none;
        /*background: #0079c0;*/
        background: #fff;
        cursor: pointer;
        outline: none;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        transition: .3s all ease;
    }

    .menu-trigger:hover{
        /*background: rgba(255,255,255,0.1);*/
    }

        .menu-trigger .lines{
            position: relative;
            display: block;
            width: 2rem;
            height: 1.3rem;
            margin-top: 0;
            transition: .3s all ease;
        }

            .menu-trigger .lines span {
                display: inline-block;
                transition: all .4s;
                box-sizing: border-box;
                /*background-color: #fff;*/
                background-color: #0079c0;
                position: absolute;
                width: 2rem;
                left: 0;
                height: 2px;
            }

            .menu-trigger .lines span:nth-of-type(1) {
                top: 0;
            }

            .menu-trigger .lines span:nth-of-type(2) {
                top: calc(50% - 1px);
            }
            .menu-trigger .lines span:nth-of-type(3) {
                bottom: 0;
            }

            .menu-trigger.active .lines span:nth-of-type(1) {
                transform: translateY(0.55rem) rotate(-315deg);
            }

            .menu-trigger.active .lines span:nth-of-type(2) {
                opacity: 0;
            }

            .menu-trigger.active .lines span:nth-of-type(3) {
                transform: translateY(-0.65rem) rotate(315deg);
            }

        .menu-trigger .menu_text{
            font-size: 0.85em;
            color: #fff;
            margin-top: 0.3em;
            font-weight: 500;
			display: none;
        }

/*-----side_nav-----*/
.side_nav{
    display: none;
    box-sizing: border-box;
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
    opacity: 0;
    width: 100%;
    height: 100%;
    transition: .3s all ease;
    background: rgba(255,255,255,0);
    padding-top: 10rem;
}

.side_nav.active{
    z-index: 9;
    opacity: 1;
    background: rgba(255,255,255,0.99);
	/*background: rgba(234,249,255,0.99);*/
}

/*改行のPC,SPでの表示切替*/
br.pc,
img.pc,
span.pc{
	display:inline;
}

br.sp,
img.sp,
span.sp{
	display:none;
}

.ta_center{
	text-align:center;
}

/*ipad*/
@media screen and (max-width:1024px){
}