@charset "utf-8";
/* Copyright 2021 FSFIELD All Rights Reserved. */

/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/

パソコン、スマートフォン（iPhone,Android) 共通

_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

/* ------------------------------------------------------------

basic

------------------------------------------------------------ */

@font-face {
	font-family: "Yu Gothic";
	src: local("Yu Gothic Medium");
	font-weight: 500;
}

@font-face {
	font-family: "Yu Gothic";
	src: local("Yu Gothic Bold");
	font-weight: bold;
}

*{font-family:'Noto Sans JP', Yu Gothic, "游ゴシック", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;}

@media (-ms-high-contrast: none) {
	*{font-family:'Noto Sans JP', Yu Gothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;}
}

html{
    -moz-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}

body{
	color: #000000;
    background: #FFF;
	font-weight: 400;
}

/* ------------------------------------------------------------

shortcodes

------------------------------------------------------------ */

/* font
---------------------------------------------- */
.normal{font-weight: normal !important;}
.bold{font-weight: bold !important;}
.italic{font-style: italic !important;}

/* display
---------------------------------------------- */
.none{display: none !important;}

/* margin
---------------------------------------------- */
.mb_none{margin-bottom: 0 !important;}


@media print, screen and (min-width:768px){ /* 表示領域が768px以上の場合に適用するスタイル */
	/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/

	PC

	_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

	/* ------------------------------------------------------------

	common

	------------------------------------------------------------ */

    body{
		font-size: 16px;
		font-size: 1.6rem;
		line-height: 1.6;
	}

	.sp{display: none;}

	.pc_br{display: block;}

	/* レイアウト
	---------------------------------------------- */
	#wrap_all{
		min-width: 1200px;
		overflow: hidden;
	}

	/* リンク
	---------------------------------------------- */
	.link01{
		color: #000;
		text-decoration: underline !important;
	}

	.link01:hover{
        opacity: 0.8;
        text-decoration: none!important;
    }

	.link_tel01{
		color: #333;
		pointer-events: none;
	}

    .tab{
        padding-right: 22px;
        background: url("../img/ico_tab01.png") no-repeat right center;
        background-size: 14px;
    }

	/* メール
	---------------------------------------------- */
	.txt_mail::after{content: "@";}

	/* 見出し
	---------------------------------------------- */
    .heading01{text-align: center;}

    .heading01 p{
        font-family: 'Roboto';
        font-size: 7rem;
        font-weight: bold;
        line-height: 1.2;
        color: #483b93;
    }

    .heading01 h2{
        font-size: 1.8rem;
        line-height: 1;
    }

    .heading02{
        position: relative;
        padding: 0 0 16px 14px;
        line-height: 1.2;
        color: #483b93;
        font-weight: bold;
        font-size: 2.8rem;
        border-bottom: 2px solid #edf5fc;
    }

    .heading02::before{
        content: "";
        background: #483b93;
        width: 4px;
        height: 30px;
        position: absolute;
        top: 2px;
        left: 0;
    }

	/* ボタン
	---------------------------------------------- */
	/*--btn_type01--*/
    .btn_type01 a{
        display: block;
        position: relative;
        border: 3px solid #483b93;
        background: #FFF;
        border-radius: 7px;
        color: #483b93;
        line-height: 1;
        text-align: center;
        padding: 43px 0;
        font-weight: bold;
        font-size: 2.8rem;
        transition: .3s;
    }

    .btn_type01 a::before{
        content: "";
        background: url("../img/ico_arrow01.png")no-repeat 0 0;
        background-size: contain;
        width: 30px;
        height: 19px;
        position: absolute;
        top: 50%;
        right: 24px;
        margin-top: -9.5px;
    }

    .btn_type01 a:hover{
        background: #483b93;
        color: #FFF;
    }

    .btn_type01 a:hover::before{
        content: "";
        background: url("../img/ico_arrow06.png")no-repeat 0 0;
        background-size: contain;
    }

    .btn_type01.tba a{
        pointer-events: none;
        background: #eeeeee;
        color: #bdbdbd;
        border-color: #dee1e6;
    }

    .btn_type01.tba a::before{background: none;}

    /*--btn_type02--*/
    .btn_type02 a{
        display: block;
        position: relative;
        width: 180px;
        margin: 0 auto;
        text-align: center;
        border: 1px solid #483b93;
        background: #FFF;
        border-radius: 4px;
        color: #603fa3;
        line-height: 1;
        padding: 11px;
        transition: .3s;
    }

    .btn_type02 a:hover{
        background: #483b93;
        color: #FFF;
    }

    .btn_type02.tba a{
        pointer-events: none;
        background: #eeeeee;
        color: #bdbdbd;
        border-color: #dee1e6;
    }

    /* ------------------------------------------------------------

	header footer 共通

	------------------------------------------------------------ */

    /* ロゴ
	---------------------------------------------- */
    .wrap_logo{
		display: flex;
		line-height: 1;
	}

	.logo01 a{
        display: block;
		padding-right: 22px;
		width: 102px;
        transition: .3s;
	}

    .wrap_logo .inner a{
        display: block;
        padding-top: 12px;
        transition: .3s;
    }

    .logo01 a:hover,
    .wrap_logo .inner a:hover{opacity: 0.7;}

	.logo02{
        width: 228px;
        padding-bottom: 3px;
    }

	.logo03{
		width: 311.5px;
		padding-bottom: 7px;
	}

	.logo04{width: 231.5px;}

	.logo01 img,
	.logo02 img,
	.logo03 img,
	.logo04 img{width: 100%;}


    /* ------------------------------------------------------------

	header

	------------------------------------------------------------ */

	#header{
        position: relative;
        z-index: 2;
    }

	#wrap_top{
		padding: 3px 0 0;
		font-size: 1.1rem;
		line-height: 1.2;
		color: #c3b2e5;
        position: absolute;
        top: 0;
        right: 10px;
	}

	.wrap_top_inner .cloned{display: none;}

	.header_inner{
        position: absolute;
        top: 0;
        left: 0;
	}

    .header_inner .wrap_logo{
        width: 474px;
        height: 120px;
        padding: 20px 0 0 20px;
        background: #FFF;
    }


	/* グローバルナビ
	---------------------------------------------- */
	.drawer{display: none;}

	.btn_close{display: none;}

	/* ------------------------------------------------------------

	footer

	------------------------------------------------------------ */

    #footer{
        background: #483b93;
        color: #FFF;
    }

	#footer > img{
        width: 100%;
        height: auto;
	}

    .footer_inner{
        position: relative;
        width: 1140px;
        margin: 0 auto;
        padding: 110px 0 20px;
        text-align: center;
    }

    .footer_inner .wrap_logo{
        display: flex;
        justify-content: center;
        align-items: center;
        background: #FFF;
        width: 100%;
        height: 123px;
		margin-top: -170px;
		margin-bottom: 50px;
    }

    .f_top{
        font-size: 1.3rem;
        margin-bottom: 90px;
    }

    .f_bottom{font-size: 1.2rem;}

    .f_small{
        font-family: 'Roboto';
        line-height: 1;
		margin-top: 15px;
    }

	/* ページトップボタン
	---------------------------------------------- */
	#pagetop{
		position: fixed;
		right: 57px;
		bottom: 94px;
		z-index: 100;
		opacity: 0;
		pointer-events: none;
		transition: opacity .3s;
	}

	#pagetop.pagetop_show{
		opacity: 1;
		pointer-events: auto;
	}

	#pagetop p{
		font-family: 'Roboto';
		font-size: 1.2rem;
		font-weight: bold;
		color: #483b93;
		letter-spacing: .24rem;
		transform: rotate(-90deg);
		transform-origin: top right;
		padding: 19px 30px 19px 0;
		cursor: pointer;
		position: relative;
	}

	#pagetop p::before,
	#pagetop p::after{
		content: "";
		display: block;
		width: 17.5px;
		height: 12px;
		background: url("../img/ico_arrow01.png") no-repeat 0 0;
		transform: rotate3d(-45deg);
		background-size: contain;
		position: absolute;
		top: 22px;
		right: 0;
		-webkit-writing-mode: vertical-rl;
		-ms-writing-mode: tb-rl;
		-o-writing-mode: vertical-rl;
		writing-mode: vertical-rl;
	}

	#pagetop p:hover::before{opacity: 0;}
	#pagetop p::after{
		opacity: 0;
		transform: translate3d(-10px,0,0);
	}

	#pagetop p:hover::after{
		opacity: 1;
		transform: translate3d(0,0,0);
		transition:transform .3s, opacity .3s;
	}


}/*--@media--*/


@media print{ /* 印刷時のみ */
	/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/

	PC

	_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

	/* ------------------------------------------------------------

	common

	------------------------------------------------------------ */

	/* レイアウト
	---------------------------------------------- */
	#wrap_all{
		width: 1200px;
		transform: scale(0.8);
		transform-origin: 0 0;
	}


}/*--@media--*/


@media only screen and (max-width:767px){ /* 表示領域が767px以下の場合に適用するスタイル */
	/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/

	スマートフォン（iPhone,Android)

	_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

	/* ------------------------------------------------------------

	common

	------------------------------------------------------------ */

    body{
		font-size: 14px;
		font-size: 1.4rem;
		line-height: 1.6;
	}

	.pc{display: none;}

	.sp_br{display: block;}

	/* レイアウト
	---------------------------------------------- */
	#wrap_all{
		min-width: 320px;
		overflow: hidden;
	}

	/* リンク
	---------------------------------------------- */
	.link01{
		color: #000;
		text-decoration: underline !important;
	}

	.link_tel01{
		color: #000;
		text-decoration: underline !important;
	}

    .tab{
        padding-right: 17px;
        background: url("../img/ico_tab01.png") no-repeat right center;
        background-size: 10.5px;
    }

	/* メール
	---------------------------------------------- */
	.txt_mail::after{content: "@";}

	/* ページタイトル
	---------------------------------------------- */
    .heading01{text-align: center;}

    .heading01 p{
        font-family: 'Roboto';
        font-size: 4rem;
        font-weight: bold;
        line-height: 1.2;
        color: #483b93;
    }

    .heading01 h2{
        font-size: 1.5rem;
        line-height: 1;
    }

    .heading02{
        position: relative;
        padding: 0 0 10px 10px;
        line-height: 1.2;
        color: #483b93;
        font-weight: bold;
        font-size: 1.9rem;
        border-bottom: 2px solid #edf5fc;
    }

    .heading02::before{
        content: "";
        background: #483b93;
        width: 3px;
        height: 20px;
        position: absolute;
        top: 2px;
        left: 0;
    }

    /* ボタン
	---------------------------------------------- */
	/*--btn_type01--*/
    .btn_type01 a{
        display: block;
        position: relative;
        border: 2px solid #483b93;
        background: #FFF;
        border-radius: 3px;
        color: #483b93;
        line-height: 1;
        text-align: center;
        padding: 18.5px 0;
        font-weight: bold;
        font-size: 1.9rem;
    }

    .btn_type01 a::before{
        content: "";
        background: url("../img/ico_arrow01.png")no-repeat 0 0;
        background-size: contain;
        width: 15px;
        height: 9.5px;
        position: absolute;
        top: 50%;
        right: 20px;
        margin-top: -4.75px;
    }

    .btn_type01.tba a{
        pointer-events: none;
        background: #eeeeee;
        color: #bdbdbd;
        border-color: #dee1e6;
    }

    .btn_type01.tba a::before{background: none;}

    /*--btn_type02--*/
    .btn_type02 a{
        display: block;
        position: relative;
        width: 68.57%;
        margin: 0 auto;
        text-align: center;
        border: 1px solid #483b93;
        background: #FFF;
        border-radius: 3px;
        color: #483b93;
        line-height: 1;
        padding: 10px;
    }

    .btn_type02.tba a{
        pointer-events: none;
        background: #eeeeee;
        color: #bdbdbd;
        border-color: #dee1e6;
    }

    /* ------------------------------------------------------------

	header footer 共通

	------------------------------------------------------------ */

    /* ロゴ
	---------------------------------------------- */
	.wrap_logo{display: flex;}

	.wrap_logo p{font-size: 0;}

	.logo01{
		width: 57px;
        padding-right: 11.5px;
		flex: none;
	}

	.wrap_logo .inner{padding-top: 4px;}

    .wrap_logo .inner a{display: block;}

	.logo02{
		width: 163.5px;
        padding-bottom: 3px;
	}

	.logo03{
		width: 199px;
		padding-bottom: 3.5px;
	}

	.logo04{width: 158.5px;}

	.logo01 img,
	.logo02 img,
	.logo03 img,
	.logo04 img{width: 100%;}


    /* ------------------------------------------------------------

	header

	------------------------------------------------------------ */

	#wrap_top{
		color: #c3b2e5;
		font-size: 1rem;
		line-height: 1.2;
		z-index: 2;
	}

	.wrap_top_inner{
		display: flex;
		flex-wrap: nowrap;
		padding: 2px 0;
	}

	.wrap_top_inner h1{white-space: nowrap;}

	.header_inner{
        height: 55px;
        position: relative;
        padding: 8px 0 0 10px;
    }

	/* メニュー
	---------------------------------------------- */
	/*--メニューを開くボタン--*/
	.btn_menu{
		background: #483b93;
		display: flex;
		align-items: center;
		justify-content: center;
		position: absolute;
		top: 0;
		right: 0;
		width: 55px;
		height: 55px;
		cursor: pointer;
	}

	.btn_menu.fixed{
		position: fixed;
		top: 0;
		right: 0;
		z-index: 2;
	}

	.btn_menu span{
		display: block;
		width: 23px;
		height: 2px;
		background:#FFF;
		position: relative;
	}

	.btn_menu span::before,
	.btn_menu span::after{
		content: "";
		display: block;
		width: 23px;
		height: 2px;
		background:#FFF;
		position: absolute;
	}

	.btn_menu span::before{top: -7px;}
	.btn_menu span::after{bottom: -7px;}

	/*--メニューを閉じるボタン--*/
	.btn_close{
		width: 55px;
		height: 55px;
		position: absolute;
		top: 0;
		right: 0;
		z-index: 3;
		display: flex;
		justify-content: center;
		align-items: center;
		cursor: pointer;
	}

	.btn_close span{
		position: relative;
		transform:rotate(-45deg);
	}

	.btn_close span::before,
	.btn_close span::after{
		content: "";
		display: block;
		width: 23px;
		height: 2px;
		background: white;
		position: absolute;
		top: 50%;
		left: 50%;
		margin-top: -1px;
		margin-left: -11.5px;
		transition:opacity .2s, transform .2s;
	}

	.btn_close span::before{
		transform:translate(11.5px,-11.5px) rotate(90deg) scaleX(0);
		opacity: 0;
		transform-origin: left;
	}

	.btn_close span::after{
		transform:scaleX(0);
		opacity: 0;
		transform-origin: right;
	}

	.drawer.open .btn_close span::before{
		transform:translate(11.5px,-11.5px) rotate(90deg) scaleX(1);
		opacity: 1;
		transition-delay: .3s;
	}

	.drawer.open .btn_close span::after{transform:scaleX(1);
		opacity: 1;
		transition-delay: .4s;
	}

	/* メニュー内
	---------------------------------------------- */
	.drawer{
        background: #483b93;
		width: 100%;
		height: 100vh;
		transition: transform .3s, opacity .3s;
		opacity: 0;
		pointer-events: none;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 3;
        visibility: hidden;
	}

	.drawer.open{
		opacity: 1;
        overflow: hidden;
		pointer-events: auto;
        visibility: visible;
	}

	.drawer .drawer_inner{
		width: 100%;
		height: 100%;
        padding-bottom: 70px;
        -webkit-overflow-scrolling: touch;
		overflow-y: scroll;
        scrollbar-width: none;
        -ms-overflow-style: none;
	}

    .drawer_inner .wrap_logo{
        background: #FFF;
        width: calc(100% - 55px);
        height: 55px;
        padding: 6px 0 0 10px;
        margin-bottom: 33px;
    }

    .drawer_inner .heading01{margin-bottom:40px;}

    .drawer_inner .heading01 p,
    .drawer_inner .heading01 h2{color: #FFF;}

    .nav_global{padding: 0 25px;}

    .nav_global li{border-top: 1px solid rgba(255,255,255,0.1);}

    .nav_global ul li:last-child{border-bottom: 1px solid rgba(255,255,255,0.1);}

    .nav_global li a{
        display: block;
        position: relative;
        line-height: 1.2;
        padding: 20px 0;
        color: #FFF;
        font-size: 1.5rem;
        font-weight: bold;
    }

    .nav_global li a::before{
        content: "";
        background: url("../img/ico_arrow03.png")no-repeat 0 0;
        background-size: contain;
        width: 6px;
        height: 10px;
        position: absolute;
        top: 50%;
        right: 13px;
        margin-top: -5px;
    }

	/* ------------------------------------------------------------

	footer

	------------------------------------------------------------ */

    #footer{
        background: #483b93;
        color: #FFF;
    }

	#footer > img{
        width: 100%;
        height: auto;
	}

    .footer_inner{
        position: relative;
        text-align: center;
        padding: 100px 0 13px;
    }

    .footer_inner .wrap_logo{
        display: flex;
        justify-content: center;
        align-items: center;
        background: #FFF;
        width: calc(100% - 50px);
        height: 63.5px;
		margin: -130px auto 70px;
    }

    .f_top{
        font-size: 1.3rem;
        margin-bottom: 70px;
    }

    .f_bottom{
		font-size: 1rem;
		padding: 0 5px;
	}

    .f_small{
        font-family: 'Roboto';
        line-height: 1;
		margin-top: 10px;
    }

	/* ページトップボタン
	---------------------------------------------- */
	#pagetop{
		background: #FFF;
		width: 100%;
		height: 70px;
		display: flex;
		justify-content: center;
		align-items: center;
		border-top: 1px solid #E5E5E5;
		cursor: pointer;
	}

	#pagetop p{
		color: #483b93;
		padding-right: 17px;
		font-family: 'Roboto';
        font-size: 1.3rem;
		letter-spacing: 0.1em;
		line-height: 1;
		position: relative;
	}

	#pagetop p::after{
		content: "";
		display: block;
		background: url("../img/ico_arrow05.png") no-repeat 0 0;
		background-size: contain;
		width: 9px;
		height: 5.5px;
		position: absolute;
		top: 50%;
		right: 0;
		margin-top: -4px;
	}


}/*--@media--*/