@import url('https://fonts.googleapis.com/css2?family=Birthstone&family=Mea+Culpa&display=swap');
#pankuzu{margin: 0;padding: 20px 0;}
#pankuzu .pankuzu-list li{color: #fff}
.bgB{background: #000;color: #fff;padding-bottom: 60px}

#online-modelroom{text-align: center}
#online-modelroom{color: #fff}
#online-modelroom h2 {font-size:90px;	text-align: center;font-weight: normal;line-height: 1.1;padding: 0px 0 0;margin-bottom: 30px}
#online-modelroom h2 span{display: block; font-size: 18px;letter-spacing: 0.1em;text-indent: 0.1em; }
#online-modelroom h2 b{font-family: "Birthstone", cursive;font-weight: normal}
#online-modelroom .copy{font-size: 30px;letter-spacing: 0.2em;}
#online-modelroom .txt{letter-spacing: 0.1em;margin: 60px 0 60px;line-height: 2;}
#online-modelroom .note-box{text-align: left;width: 100%;margin: 30px 0 0 0;font-size: 13px}
@media screen and (max-width: 668px) {/*スマホ設定*/
#online-modelroom{padding-top: 0px;}
#online-modelroom h2 {font-size: 40px;margin-bottom: 20px;padding-top: 0}
#online-modelroom h2 span{font-size: 13px; }
#online-modelroom .copy{font-size: 18px;}
#online-modelroom .txt{font-size: 13px;text-align: left;margin: 30px 0 30px;}
}

.doublebtn{margin: 60px auto;text-align: center;}
.doublebtn li,.doublebtn ul{margin: 0;padding: 0;list-style: none}

.sharebutton,
.sharebuttonBlue{ font-size: 130%;}
.sharebutton a {
	display: block;
	padding:30px 10px;
	color: #fff;
	background: linear-gradient(45deg, #101119, #005939 52%, #101119);
	margin-top: 10px;
	box-shadow: 0 8px 15px rgba(0, 0, 0, .2);position:relative;outline: 1px solid rgb(255, 255, 255);    outline-offset: -6px;
}
.sharebutton a:hover {
	background: linear-gradient(45deg, #005939, #101119 52%, #005939);
	box-shadow: none;
}

.sharebuttonBlue a {
	display: block;
	padding:30px 10px;
	color: #fff;
	background: linear-gradient(45deg, #0c295e, #2056b4 52%, #0c295e);
	margin-top: 10px;
	box-shadow: 0 8px 15px rgba(0, 0, 0, .2);position:relative;outline: 1px solid rgb(255, 255, 255);    outline-offset: -6px;
}
.sharebuttonBlue a:hover {
	background: linear-gradient(45deg, #2056b4, #0c295e 52%, #2056b4);
	box-shadow: none;
}
.sharebutton a:after,
.sharebuttonBlue a:after  {
    content: '';
    width: 8px;
    height: 8px;
    margin-top: -5px;
    border-top: solid 1px #fff;
    border-right: solid 1px #fff;
    transform: rotate(45deg);
    position: absolute;
    top: 50%;
    right: 40px;
}
@media screen and (max-width: 668px) {/*スマホ設定*/
.doublebtn .col2{width: 100%;margin: auto}
.sharebutton,
.sharebuttonBlue{ font-size: 100%;}
.sharebutton{margin-bottom: 30px!important}
}

.online-modelroom_wrap{margin: 100px auto 0;max-width:1180px;}
.online-modelroom_wrap h4 {
	background: #fcf9ed;
	text-align: center;
	font-weight: 500;
	font-style: normal;
	margin: 0;
    font-size: 260%;
	line-height: 1.5;
	color: #005939;
	padding: 12px 0
}
.online-modelroom_wrap h4 span{font-size: 60%;}
.online-modelroom_wrap .vr {position: relative; margin:auto;}
.online-modelroom_wrap .vr iframe {width: 100%; display:block; margin:0 auto;}
@media print, screen and (min-width: 768px) {

    .online-modelroom_wrap .vr iframe {height:623px;}
}

@media screen and (max-width: 767px) {
    .pageOnlineModelroom .iframe-wrapper {padding:20px;}
    .pageOnlineModelroom .iframe-wrapper iframe {width:calc(100vw - 40px); height:calc(100vh - 280px);}
}

@media screen and (max-width: 668px) {/*スマホ設定*/
#online-modelroom.inner--base{width: 90%;padding-top: 40px}
.online-modelroom_wrap .vr  iframe {width:calc(100vw - 40px); height:calc(100vh - 280px);}
}



#online-modelroom .onlinemodel{}
#online-modelroom .onlinemodel .contents.copytext { padding-bottom: 0; padding-top: 0;}
#online-modelroom .onlinemodel .copytext {}
#online-modelroom .onlinemodel .copytext h3 { font-size: 240%; font-weight: normal;}
#online-modelroom .onlinemodel .copytext p { line-height: 1.8; margin-top: 20px; font-size: 120%;}

#online-modelroom .onlinemodel .doublebtn ul li { color: #000;}





@media screen and (max-width: 767px) {
    #online-modelroom .iframe-wrapper {padding:20px;}
    #online-modelroom .iframe-wrapper iframe {width:calc(100vw - 40px); height:calc(100vh - 280px);}
}

/*バーチャルモデルルーム*/
#online-modelroom .vmr {
	background: url("../common/img/contents/index/vmr_bg.jpg") no-repeat 50% 50%;
	text-align: center;
	padding: 80px 0;
}
#online-modelroom .vmr h2 { font-size: 30px; margin-bottom: 20px; letter-spacing: 0.075em; line-height: 1.5;}
#online-modelroom .vmr p { margin-bottom: 30px; line-height: 1.5;}
#online-modelroom .footer { margin-top: 0;}
#online-modelroom .attonline { font-size: 80%; margin-top: 30px; line-height: 1.5;}
@media screen and (max-width: 767px) {
	#online-modelroom .vmr h2 { font-size: 24px;}
}

#online-modelroom .vrtype ul {
	display: flex;
	flex-wrap: wrap;
	justify-content:center;
}
#online-modelroom .vrtype ul li {
	width: 50%;
	margin: 0 10px;
}

#online-modelroom .vrtype .plan_Item .flex1 {
	background: #fcf9ed;
	padding: 15px 30px;

}
#online-modelroom .vrtype .plan_Item .flex1 img{width: 100%;height: auto}
#online-modelroom .vrtype .plan_Item .s_type {
	font-weight: 500;
	font-style: normal;
	margin: 0;
    font-size: 300%;
	line-height: 0.8;
	color: #005939;	
}
#online-modelroom .vrtype .plan_Item .s_type span { font-size: 53%;}
#online-modelroom .vrtype .plan_Item .s_type em {
	font-size: 73%;
	font-weight: 500;
	font-style: normal;
	line-height:1;
}
#online-modelroom .vrtype .plan_Item .s_original { font-size: 120%;margin-top: 10px}
#online-modelroom .vrtype .plan_Item .photo,
#online-modelroom .vrtype .plan_Item .linkbtn { display: block;}
#online-modelroom .vrtype .plan_Item .photo img{vertical-align: top}
#online-modelroom .vrtype .plan_Item .righttext { font-size: 90%;}
#online-modelroom .vrtype .plan_Item .righttext em { font-style: normal;}
#online-modelroom .vrtype .plan_Item .linkbtn { background: #005537; color: #fff; padding: 15px;}
#online-modelroom .vrtype .plan_Item a { text-decoration: none; display: block; text-align: center; color: #000; transition: .5s;}
#online-modelroom .vrtype .plan_Item a:hover { opacity: 0.8;}
#online-modelroom .vrtype .plan_Item .linkbtn a { color: #fff;}

#online-modelroom .vrtype .plan_Item .linkbtn:after {
    content: "\f078";
    display: inline-block;
    margin-left: 15px;
    color: #ffffff;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
}

@media screen and (max-width: 767px) {
	#online-modelroom .onlinemodel .contents.copytext { padding-top: 30px;}
	#online-modelroom .onlinemodel .copytext p { text-align: left;}
	#online-modelroom .vrtype ul li { width: 100%; margin: 10px 0;}
	#online-modelroom .vrtype .plan_Item .s_type { font-size: 260%;}
	#online-modelroom .vrtype .plan_Item .s_original { font-size: 85%;}
	#online-modelroom .vrtype .plan_Item .righttext { font-size: 80%;}

}