@charset "UTF-8";
/* CSS Document */
/*==================================================================================================== */
@media screen and (max-width: 768px) {
/* base */

body {
	/*font-weight: 400;*/
	font-size: 14px;
}
}



/*@media only screen and (max-width: 768px){
* {
    font-weight: 500;
}
}*/



/* Communication //////////////////*/
.cmn-cvArea{
	background-color: #F4F1E8;
	border: none;
	width: auto;
	padding: 0 0 100px
}
/*枠線打消し*/
.cmn-cvArea .cvArea__item figure.intro {
	border: none;
	padding: 0;
	width: auto; 
	margin: 0 auto;
}
.cmn-cvArea .cvArea__header{
	padding: 100px 0 60px;
}
.cmn-cvArea .cvArea__header h2.title{
	font-weight: 400 !important;
	font-size: 21px !important;
	letter-spacing: 0.2em !important;
	text-align: center;
}
.cmn-cvArea .cvArea__header h2 span{
	display: block;
	margin: 0 0 8px;
}
.cmn-cvArea .cvArea__header h2 span img{
	width: 300px;
}
.cmn-cvArea .cvArea__body{
	background-color: #FFFFFF;
	width: auto;
	/*
	margin: 0 -112px;
	*/
	padding: 80px 0
}
/*カタログをプレゼント*/
.cvArea__item h3{
	font-size : 22px;
	letter-spacing : 0.1em;
	color : #FFFFFF !important;
	background : #172C6C;
	padding: 11px 0;
	margin: 0 auto 50px;
	font-family: Meiryo, 'Hiragino Kaku Gothic ProN', 'Yu Gothic', YuGothic, Helvetica, Arial, sans-serif !important;
}
.cvArea__item h3 span{
	display: inline-block;
	width: 24px;
	height: 24px;
	background-image: url("../img/mark_book.png");
	background-repeat: no-repeat;
	margin-right: 18px;
	position: relative;
	top: 2px;
}
.cmn-cvArea figcaption{
	text-align: center !important;
}

/* mobile用 */
@media screen and (max-width:768px) {
	.pc-cont{
		display: none;
	}
	.sp-cont{
		display: block;
	}
	.cmn-cvArea{
		background-color: #F4F1E8;
		border: none;
		width: auto;
		padding: 0 0 30px;
	}
	.cmn-cvArea .cvArea__header{
		padding: 40px 0 20px;
	}
	.cmn-cvArea .cvArea__header h2.title{
		font-size: 5vw !important;
		letter-spacing: 0.2em !important;
	}
	.cmn-cvArea .cvArea__header h2 span img{
		width: 60vw;
	}
	.cmn-cvArea .cvArea__body{
		padding: 6% 0;
		margin: 0;
	}
	.cvArea__item h3{
		font-size : 4vw;
		padding: 3px 3px 5px;
		margin: auto;
		text-align: center;
		letter-spacing : 0;
	}
	.cvArea__item h3 span{
		display: block;
		margin: 0 auto 4px;
	}
}

/*=======================================
　common
=======================================*/
@media screen and (max-width: 768px) {
	#contents,
	body #contents {
		font-family: "Noto Sans JP", YakuHanJP, 游ゴシック体, YuGothic, "游ゴシック Medium", "Yu Gothic Medium", 游ゴシック, "Yu Gothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, Meiryo, "MS PGothic", Osaka, sans-serif;
		-webkit-font-smoothing: antialiased;
		font-feature-settings: "palt";
		text-size-adjust: 100%;
	}
	.w990 {
		max-width: inherit;
	}
	#main h1 {
		padding: 0;
	}
}

/*=======================================
　ボタン
=======================================*/
@media screen and (max-width: 768px) {
	.tenjijyo_btn {
		max-width: inherit;
	}
	.tenjijyo_btn .tenjijyo_btn_txt {
		display: block;
		font-size: calc(24 / 745 * 100vw);
		line-height: 2.33;
		letter-spacing: 0.08em;
		text-align: center;
		margin-bottom: calc(10 / 745 * 100vw);
	}
	#main > .tenjijyo_btn {
		width: 90%;
		margin: 0 auto;
	}
}

/*=======================================
　float_btn
=======================================*/
@media screen and (max-width: 768px) {
	.float_btn {
		height: calc(92 / 745 * 100vw);
	}
	.float_btn a span{
		font-size: calc(30 / 745 * 100vw);
	}
	.float_btn a span::after {
		width: calc(20 / 745 * 100vw);
		height: calc(38 / 745 * 100vw);
		right: calc(-42 / 745 * 100vw);
	}
}

/*=======================================
　mv
=======================================*/
@media screen and (max-width: 768px) {
	.mv {
	    margin-bottom: calc(139 / 745 * 100vw);
	}
}

/*=======================================
　intro
=======================================*/
@media screen and (max-width: 768px) {
	.intro {
	    margin-bottom: calc(344 / 745 * 100vw);
	}
	.intro p {
	    font-size: calc(29 / 745 * 100vw);
		line-height: 1.827;
		letter-spacing: 0.04em;
	}
}

/*=======================================
　cmn_section
=======================================*/
@media screen and (max-width: 768px) {
	.cmn_section_wrap {
		margin-bottom: calc(144 / 745 * 100vw);
		row-gap: calc(352 / 745 * 100vw);
	}
	.cmn_section_wrap .cmn_section .cmn_section_block01 .img {
		width: 94.63%;
	}
	.cmn_section_wrap .cmn_section .cmn_section_block01 .copy {
		width: 27.78%;
		top: -12.5%;
		padding: 0 calc(30 / 745 * 100vw) calc(33 / 745 * 100vw);
	}
	.cmn_section_wrap .cmn_section .cmn_section_block02 .inner {
		width: 100%;
		max-width: inherit;
		flex-direction: column-reverse;
		align-items: start;
		row-gap: calc(74 / 745 * 100vw);
	}
	.cmn_section_wrap .cmn_section .cmn_section_block02 .img {
		width: 78.19%;
	}
	.cmn_section_wrap .cmn_section .cmn_section_block02 .txt {
		font-size: calc(25 / 745 * 100vw);
		line-height: 1.84;
	}
	.cmn_section_wrap .cmn_section .cmn_section_block03 .txt {
		font-size: calc(28 / 745 * 100vw);
		line-height: 1.607;
		margin-bottom: calc(48 / 745 * 100vw);
	}
	.cmn_section_wrap .cmn_section:nth-child(2) .cmn_section_block01 .copy {
		width: 36%;
	}
	.cmn_section_wrap .cmn_section:nth-child(even) .cmn_section_block02 .inner {
		flex-direction: column-reverse;
	}
	.cmn_section_wrap .cmn_section:nth-child(odd) .cmn_section_block01 .copy {
		left: 8.82%;
	}
	.cmn_section_wrap .cmn_section:nth-child(even) .cmn_section_block01 .copy {
		right: 8.82%;
	}
	.cmn_section_wrap .cmn_section:nth-child(odd) .cmn_section_block02 .img {
		margin-left: 0;
	}
	.cmn_section_wrap .cmn_section:nth-child(even) .cmn_section_block02 .img {
		margin-left: auto;
	}
	.cmn_section_wrap .cmn_section:nth-child(odd) .cmn_section_block02 .txt {
		margin-right: 12.75%;
		margin-left: auto;
	}
	.cmn_section_wrap .cmn_section:nth-child(even) .cmn_section_block02 .txt {
		margin-left: 12.75%;
	}
}

/*=======================================
　expert_designer_sec
=======================================*/
@media screen and (max-width: 768px) {
	.expert_designer_sec {
		padding: calc(85 / 745 * 100vw) 0;
	}
	.expert_designer_sec .inner {
		max-width: inherit;
	}
	.expert_designer_sec .inner h2 {
		font-size: calc(36 / 745 * 100vw);
		margin-bottom: calc(40 / 745 * 100vw);
		line-height: 1.638;
	}
	.expert_designer_sec .inner .txt {
		font-size: calc(28 / 745 * 100vw);
		margin-bottom: calc(30 / 745 * 100vw);
		line-height: 1.607;
		font-weight: 400;
	}
}

/* モーダル用スタイル */
@media screen and (max-width: 768px) {
    .modal_expert_designer {
		padding: calc(100 / 745 * 100vw) 0 0!important;
		width: calc(686 / 745 * 100vw);
    }
	.modal_expert_designer .modal_expert_designer_inn {
		padding: calc(120 / 745 * 100vw) 0 calc(90 / 745 * 100vw);
	}
    .modal_expert_designer .modal_ttl {
		font-size: calc(38 / 745 * 100vw);
		letter-spacing: -0.03em;
		margin-bottom: calc(30 / 745 * 100vw);
    }
    .modal_expert_designer .modal_body .flex_area {
        flex-direction: column-reverse;
		row-gap: calc(31 / 745 * 100vw);
		margin-bottom: calc(53 / 745 * 100vw);
    }
    .modal_expert_designer .modal_body .img {
        width: 100%;
    }
    .fancybox-container .modal_expert_designer .modal_body .txt p {
		font-size: calc(29 / 745 * 100vw);
		line-height: 1.758!important;
    }
    .modal_expert_designer .modal_btn {
		width: calc(373 / 745 * 100vw);
		height: calc(71 / 745 * 100vw);
		text-decoration: none;
    }
	.modal_expert_designer .modal_btn span {
		font-size: calc(30 / 745 * 100vw);
		padding-right: calc(43 / 745 * 100vw);
	}
	.modal_expert_designer .modal_btn span::after {
		width: calc(23 / 745 * 100vw);
		height: calc(31 / 745 * 100vw);
	}
    .modal_expert_designer .modal_btn_wrap {
		margin-right: auto;
    }
}

/* Fancybox 閉じるボタン カスタマイズ */
/* 親要素のclippingを解除してボタンをモーダル外に表示 */
@media screen and (max-width: 768px) {
    .fancybox-close-small {
        top: calc(25 / 745 * 100vw) !important;
        width: calc(52 / 745 * 100vw) !important;
        height: calc(52 / 745 * 100vw) !important;
    }
}

/*=======================================
　sumai_sec
=======================================*/
@media screen and (max-width: 768px) {
	.sumai_sec {
		margin-bottom: calc(58 / 745 * 100vw);
	}
	.sumai_sec .inner h2 {
		margin-bottom: calc(60 / 745 * 100vw);
	}
	.sumai_sec .inner h2 small {
		font-size: calc(32 / 745 * 100vw);
		line-height: 1.65625;
		font-weight: 500;
	}
	.sumai_sec .inner h2 span {
		font-size: calc(38 / 745 * 100vw);
		font-weight: 500;
	}
	.sumai_sec .inner .sumai_block_wrap {
		row-gap: calc(54 / 745 * 100vw);
	}
	.sumai_sec .inner .sumai_block_wrap .sumai_block {
		border: 2px solid #21366e;
		border-radius: calc(10 / 745 * 100vw);
		padding-bottom: calc(60 / 745 * 100vw);
	}
	.sumai_sec .inner .sumai_block_wrap .sumai_block h3 {
		flex-direction: column;
		row-gap: calc(70 / 745 * 100vw);
	}
	.sumai_sec .inner .sumai_block_wrap .sumai_block h3 .sumai_ttl_label {
		width: 100%;
		height: calc(97 / 745 * 100vw);
		font-size: calc(30 / 745 * 100vw);
		padding: 0 calc(10 / 745 * 100vw);
	}
	.sumai_sec .inner .sumai_block_wrap .sumai_block h3 .sumai_ttl_txt {
		width: 100%;
		font-size: calc(38 / 745 * 100vw);
		text-align: center;
		margin-bottom: calc(13 / 745 * 100vw);
	}
	.sumai_sec .inner .sumai_block_wrap .sumai_block .flex_area {
		flex-direction: column;
		row-gap: calc(25 / 745 * 100vw);
		margin-bottom: calc(29 / 745 * 100vw);
	}
	.sumai_sec .inner .sumai_block_wrap .sumai_block .flex_area .txt,
	.sumai_sec .inner .sumai_block_wrap .sumai_block .flex_area .img,
	.sumai_sec .inner .sumai_block_wrap .sumai_block .bnr_area,
	.sumai_sec .inner .sumai_block_wrap .sumai_block .point {
		width: 86.03%;
		margin: 0 auto;
	}
	.sumai_sec .inner .sumai_block_wrap .sumai_block .flex_area .txt {
		font-size: calc(29 / 745 * 100vw);
		line-height: 1.758;
		font-weight: 400;
	}
	.sumai_sec .inner .sumai_block_wrap .sumai_block .bnr_area {
		margin-bottom: calc(26 / 745 * 100vw);
	}
	.sumai_sec .inner .sumai_block_wrap .sumai_block .point {
		flex-direction: column;
		border: 5px solid #21366e;
		border-radius: calc(26 / 745 * 100vw);
	}
	.sumai_sec .inner .sumai_block_wrap .sumai_block .point .icon {
		width: 100%;
		background: #21366e;
	}
	.sumai_sec .inner .sumai_block_wrap .sumai_block .point .icon img {
		display: none;
	}
	.sumai_sec .inner .sumai_block_wrap .sumai_block .point .icon span {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		height: calc(111 / 745 * 100vw);
		font-weight : 700;
		font-size: calc(36 / 745 * 100vw);
		letter-spacing: 0.2em;
		color: #fff;
		padding-left: calc(4 / 745 * 100vw);
	}
	.sumai_sec .inner .sumai_block_wrap .sumai_block .point .txt {
		border: none;
		font-size: calc(29 / 745 * 100vw);
		line-height: 1.724;
		padding: calc(30 / 745 * 100vw) calc(45 / 745 * 100vw);
		width: 100%;
	}
}

/*=======================================
　bnr_detail
=======================================*/
@media screen and (max-width: 768px) {
	.bnr_detail {
	    margin-bottom: calc(71 / 745 * 100vw);
	}
}

/*=======================================
　gpsMap_area
=======================================*/
@media screen and (max-width: 768px) {
	#gpsMap_area {
	    margin-bottom: calc(108 / 745 * 100vw);
	}
}

/*=======================================
　bnr_catalog
=======================================*/
@media screen and (max-width: 768px) {
	.bnr_catalog {
	    margin-bottom: calc(116 / 745 * 100vw);
	}
}

/*=======================================
　最下部tenjijyo_btn
=======================================*/
@media screen and (max-width: 768px) {
	#main > .tenjijyo_btn {
	    margin-bottom: calc(116 / 745 * 100vw);
	}
}