body{
	font-family:"ヒラギノ角ゴ Pro",Hiragino Kaku Gothic Pro, Meiryo, 'メイリオ', "MS P Gothic", "ＭＳ Ｐゴシック", "Hiragino Kaku Gothic Pro W3", Osaka,  sans-serif;
	font-feature-settings: "palt";
	box-sizing: border-box;
}
a,a:hover{text-decoration: none;
	-webkit-transition: .3s all cubic-bezier(.17,.67,.83,.67);
	transition: .3s all cubic-bezier(.17,.67,.83,.67);
	}
a:hover{opacity: .7;}

.cf{clear: both;
	width: 100%;
	content: '';
	display: block;}

.pagetop{text-align: right;
	font-weight: bold;
	padding-top: .3em;
	padding-bottom: 1em;
}

.mo_none{display: none;}

#wrap{width: 100%;
    margin: 0;}
.scroll-prevent{overflow: hidden;}

@media screen and (min-width: 768px) {
	#wrap{  /*★★★*/max-width: 1220px;
    margin: 10px auto;}
    .mo_none{display: block;}
    .mo_only{display: none;}
}

/* HEADER */
#header{
	background-color: #fff;
	top: 0;
	left: 0;
	width: 100%;
	position: fixed;
	padding: 0;
	height: 80px;
	border-bottom: 1px solid #afafaf;
	z-index: 10;
	box-sizing: border-box;
}

#header .head-title-box{padding: 10px;}
#header .head-title-box img{max-width: 100%;
	width: 175px;
	height: auto;
}
#header h1{
	font-size: 10px;
	font-weight: bold;}

.head-info-box{font-size: 12px;
	font-weight: bold;}

.head-info-box .mail-box{
	display: flex;
	align-items: baseline;
	padding-bottom: 5px;
	margin-bottom: 8px;
	border-bottom: 1px solid #000;}

.head-info-box .mail-box span{
	display: block;
	margin-right: 10px;}

.head-info-box .mail-box a{
	display: block;
	font-size: 20px;
	font-weight: bold;
	color: #00a0e9;}

.head-info-box .allarea-tel-box{
	display: flex;
	align-items: center;}
.head-info-box .allarea-tel-box span{display: block;}
.head-info-box .allarea-tel-box a{
	display: block;
	padding-top: 5px;
	font-size: 26.62px;
	font-weight: bold;
	color: #ec0f7f;}
.head-info-box .allarea-tel-box div:last-child{
	background-color: #0102fb;
	color: #fff;
	text-align: center;
	font-weight: bold;
	margin-left: 10px;
	padding: 5px;
	font-size: 16px;
	line-height: 1.5;}

.head-info-box .region-tel-box{font-size: 14px;
	padding-top: 8px;
	font-weight: bold;}
.head-info-box .region-tel-box span{color: #ab0000;}


#header .trigger {
	position: absolute;
	top: 28px;
	right: 15px;
	content: '';
	cursor: pointer;
	width: 30px;
	height: 30px;
	z-index: 20;}

#header .trigger span{
	position: absolute;
	content: '';
	width: 100%;
	height: 1px;
	top: 50%;
	left: 0;
	z-index: 0;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	background-color: #4d4d4d;
	-webkit-transition: .3s all cubic-bezier(.17,.67,.83,.67);
	transition: .3s all cubic-bezier(.17,.67,.83,.67);
	}

#header .trigger span:nth-child(2){top: 20%;}
#header .trigger span:nth-child(3){top: 80%;}

#header .trigger.active span:nth-child(1){opacity: 0;}
#header .trigger.active span:nth-child(2){
	top: 50%;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);}
#header .trigger.active span:nth-child(3){
	top: 50%;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);}



@media screen and (min-width: 768px) {
	#header{
		height: auto;
		width: auto;
		position: static;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 10px;
	box-sizing: content-box;}
	#header .head-title-box{padding: 0px;}
	#header .head-title-box img{width: auto;}
	#header h1{	font-size: 14px;}
}

/* NAVIGATION */
#navigation ul{
	background: #000;
	align-items: center;
	color: #fff;
	padding: 0.7em 10px 0.5em;
	margin-bottom: 15px;

	}
#navigation ul li{display: block;}

#navigation ul li a{
	display: block;
	font-size: 14px;
	color: #fff;
	font-weight: bold;
	text-decoration: none;}

#pankuzu{
	margin-top: 7px;
	padding-left: 15px;
	padding-right: 15px;
	margin-bottom: 7px;
	font-weight: bold;}

#pankuzu a{text-decoration: none;}

#pagenavi{
	margin-top: 15px;
	padding-left: 0px;
	padding-right: 0px;
	margin-bottom: 15px;
	font-weight: bold;}

#pagenavi_text a{
	text-decoration: none;
	font-size: 12px;
}

.mo_only #navigation{
	overflow-y: scroll !important;
	top: 80px;
	left: 0;
	position: fixed;
	width: 100%;
	height: calc(100% - 80px);
	-webkit-transform:translateY(-100%);
	transform:translateY(-100%);
	z-index: 2;
	-webkit-transition: .3s all cubic-bezier(.17,.67,.83,.67);
	transition: .3s all cubic-bezier(.17,.67,.83,.67);}

.mo_only #navigation ul{
	padding-top: 0px;
	padding-bottom: 10px;
	margin-bottom: 0;
	background: #fff;
	box-shadow: 4px 4px 8px 0px rgba(0,0,0,0.15);
	}

.mo_only #navigation.active{
	-webkit-transform:translateY(0%);
	transform:translateY(0%);
	-webkit-transition: .3s all cubic-bezier(.17,.67,.83,.67);
	transition: .3s all cubic-bezier(.17,.67,.83,.67);
}

.mo_only #navigation a{
	padding: 9px 5px;
	position: relative;
	border-top: 1px solid #ddd;
	margin-top: -1px;
	color: #333
}


.mo_only #navigation a:after{
	content: " ";
    width: 12px;
    height: 12px;
    display: block;
    position: absolute;
    top: 15px;
    right: 10px;
    background: url(https://visipri.com/share/images/icon_link_arrow.png) no-repeat;
    background-size: cover;
	}

.mo_only #navigation a:hover:after{
	right: 13px;
	-webkit-transition: .3s all cubic-bezier(.17,.67,.83,.67);
	transition: .3s all cubic-bezier(.17,.67,.83,.67);}

@media screen and (min-width: 768px) {
	#pankuzu{padding: 0;
		margin-top: 0;}
	#navigation ul{
	display: flex;
	justify-content: space-evenly;}
}



/* MAIN */
main{display: flex;
	flex-wrap: wrap;

}
main #main_top,
main #left_column,
main #right_column{float: none;
	width:100%;
	box-sizing: border-box;
}
main #right_column {
    margin-top: 0px;
}
#container{width: 100%;
	box-sizing: border-box;
	border: none;
	position: relative;
}

main #main_top img {
	max-width: 100%;
}

main #left_column{order: 2;}

@media screen and (min-width: 768px) {
	main{
		justify-content: space-between;
		margin-top: 0px;}

	#container{  /*★★★width: 896px;*/
	box-sizing: content-box;
	border: 2px solid #666;
	border-bottom: none;}

	main #left_column{
		 /*★★★width: 218px;*/
		 max-width: 300px;
		order: 1;}

	main #right_column{
		float: left;
		 /*★★★width:660px;*/
        margin-top: 0;
		order: 2;}

	main #left_column,
	main #right_column{box-sizing: content-box;}

}

/* SIDEBAR */
.sidebar-wrapper img{max-width: 100%;}
.sidebar-wrapper{

/*220712 del yachi
	position: sticky;
*/
	top: 10px;
	padding-right: 12px;
}

.sidebar-tel-box{
	border-top: 1px solid #afafaf;
	border-bottom: 1px solid #afafaf;
	padding-bottom: 10px;
	padding-top: 10px;
	text-align: center;
	margin-bottom: 10px;
	display: none;
}

.sidebar-tel-box h5{
	background: #ec0f7f;
	color: #fff;
	font-size: 12px;
	padding: .5em;
	font-weight: bold;}

.sidebar-tel-box a{
	font-size: 22px;
	color: #ec0f7f;
	font-weight: bold;}

.sidebar-tel-box .region-tel-box{
	display: flex;
	font-weight: bold;
	justify-content: space-between;
	align-items: center;
}

.sidebar-tel-box .region-tel-box a{font-size: 14px;
	color: #000;
	display: inline-block;
	letter-spacing: 0;}
.sidebar-tel-box .region-tel-box a span{color: #ab0000;}

.sidebar-tel-box .region-tel-box > div:first-child{
	background-color: #000;
	color: #fff;
	padding: .5em;
	letter-spacing: 0em;
	flex-basis: 33%;
	line-height: 1.2;
}
.sidebar-tel-box .region-tel-box > div:last-child{
		display : -webkit-inline-box;
	display : -ms-inline-flexbox;
	display : -webkit-inline-flex;
	display : inline-flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-end;
}
.sidebar-tel-box .region-tel-box div:last-child div{
		display : -webkit-inline-box;
	display : -ms-inline-flexbox;
	display : -webkit-inline-flex;
	display : inline-flex;
	align-items: center;
}


.sidebar-wrapper .order-btn{
	display: none;
	background: #d30101;
	color: #ffff00;
	font-weight: bold;
	font-size: 33px;
	border-radius: 10px;
	position: relative;
	width: 100%;
	height: 100px;
	margin-bottom: 20px;
	margin-top: 20px;
}

.sidebar-wrapper .order-btn:after{
		content: '';
	position: absolute;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 8px 0 8px 10px;
	border-color: transparent transparent transparent #ffff00;;
	top: 50%;
	right: 18px;
	-webkit-transform: translate(0%,-50%);
	transform: translate(0%,-50%);
	-webkit-transition: .3s all cubic-bezier(.17,.67,.83,.67);
	transition: .3s all cubic-bezier(.17,.67,.83,.67);
}
.sidebar-wrapper .order-btn:hover:after{
	right: 13px;
	-webkit-transition: .3s all cubic-bezier(.17,.67,.83,.67);
	transition: .3s all cubic-bezier(.17,.67,.83,.67);
}


.sidebar-wrapper .order-btn .inner {
	content:'';
	text-align: left;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	-webkit-transform: translate(-50%, -58%);
	transform: translate(-50%, -58%);}

.sidebar-wrapper .order-btn .inner h6{
	font-size: 12px;
	color: #d30101;
	font-weight: bold;
	text-align: center;
	background: #fff;}

.sidebar-wrapper .order-btn .inner div{
	padding-left: 23px;
	padding-right: 40px;
}


.sidebar-wrapper .product-section{margin-bottom: 50px;}
.sidebar-wrapper .product-section:last-child{margin-bottom: 0;}

.product-sidebar-box h4{font-weight: bold;
	font-size: 14px;
	margin-bottom: .8em;}

.product-sidebar-box .product-section-title{
	display: flex;
	align-items: center;
	justify-content: space-between;
	background: #000;
	color: #fff;
	font-size: 14px;
	font-weight: bold;
	padding: 15px 10px;
	line-height: 1;}

.product-sidebar-box .product-section-title div:last-child{
	font-size: 12px;
	opacity: .7;}

.product-sidebar-box .product-section.size ul{
	display: flex;
	flex-wrap: wrap;}

.product-sidebar-box .product-section.size ul li{flex-basis: 50%;}
.product-sidebar-box .product-section ul li,
.product-sidebar-box .product-section ul li a{display: block;}


.product-sidebar-box .product-section ul li{
	box-sizing: border-box;
	border: 1px solid #afafaf;
	margin-top: -1px;}

/* .product-sidebar-box .product-section.size ul li{border: none;} */

.product-sidebar-box .product-section ul li a{
	display: flex;
	align-items: center;
	padding: 4px;
	position: relative;
	font-weight: bold;
	font-size: 14px;}




.product-sidebar-box .product-section.size ul li a{
	background-color: #ddd;
	font-size: 13px;
	display: block;
	padding: 3px 5px;
}
.product-sidebar-box .product-section.size ul li a span{
	font-size: 11px;
	margin-left: 0;
	flex-basis: 100%;
}

.product-sidebar-box .product-section.use ul li a{
	background-color: #fffadc;
	font-size: 12px;
	display: block;
	padding: 6px 5px 8px 5px;
}
.product-sidebar-box .product-section.use ul li a span{
	font-size: 12px;
	margin-left: 0;
	flex-basis: 100%;
}


.product-sidebar-box .product-section.design ul li a{
	background-color: #ffe3e3;
	font-size: 12px;
	display: block;
	padding: 3px 5px;
}

.product-sidebar-box .product-section.design ul li a span{
	font-size: 12px;
	margin-left: 0;
	flex-basis: 100%;
}

.product-sidebar-box .product-section.special ul li a{
	background-color: #f0fff0;
	font-size: 14px;
	display: block;
	padding: 6px 5px 8px 5px;
}

.product-sidebar-box .product-section.special ul li a span{
	font-size: 11px;
	margin-left: 0;
	flex-basis: 100%;
}



.product-sidebar-box .product-section.plan ul li a{
	background-color: #e0ffff;
	font-size: 14px;
	display: block;
	padding: 6px 5px 8px 5px;
}

.product-sidebar-box .product-section.plan ul li a span{
	font-size: 11px;
	margin-left: 0;
	flex-basis: 100%;
}

.product-sidebar-box .product-section.information ul li a{
	background-color: #f0fff0;
	font-size: 14px;
	display: block;
	padding: 6px 5px 8px 5px;
}

.product-sidebar-box .product-section.information ul li a span{
	font-size: 11px;
	margin-left: 0;
	flex-basis: 100%;
}



.product-sidebar-box .product-section ul li a:after{
	content: '';
	position: absolute;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 4px 0 4px 5px;
	border-color: transparent transparent transparent #000000;
	top: 50%;
	right: 18px;
	-webkit-transform: translate(0%,-50%);
	transform: translate(0%,-50%);
	-webkit-transition: .3s all cubic-bezier(.17,.67,.83,.67);
	transition: .3s all cubic-bezier(.17,.67,.83,.67);}

.product-sidebar-box .product-section ul li a:hover:after{
	right: 13px;
	-webkit-transition: .3s all cubic-bezier(.17,.67,.83,.67);
	transition: .3s all cubic-bezier(.17,.67,.83,.67);}

.product-sidebar-box .product-section ul li a span{
	font-weight: normal;
	display: block;
	font-size: 12px;}

@media screen and (min-width: 768px) {
	.product-sidebar-box .product-section ul{display: block;}

	.product-sidebar-box .product-section.size ul{display: block;}
	.product-sidebar-box .product-section.size ul li a span{
	flex-basis: auto;}

	.sidebar-tel-box,
	.sidebar-wrapper .order-btn{display: block;}
}

/* FOOTER */
#visi-service{
	box-sizing: border-box;
	padding: 30px 15px;
	background: #f1f2f1;
	}

#visi-service .visi-service-title{
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 1em;}


#visi-service ul li{
	display: block;
	width: auto;
	padding: 5px;}

#visi-service ul li a:before{
	content: "▶";
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	-webkit-transform: translate(0, -50%);
	transform: translate(0, -50%);
	-webkit-transition: .3s all cubic-bezier(.17,.67,.83,.67);
	transition: .3s all cubic-bezier(.17,.67,.83,.67);}

#visi-service ul li a:hover:before{
	transform: translate(5px, -50%);
	-webkit-transform: translate(5px, -50%);
	-webkit-transition: .3s all cubic-bezier(.17,.67,.83,.67);
	transition: .3s all cubic-bezier(.17,.67,.83,.67);
}

#visi-service ul li a{
	padding-left: 1.5em;
	position: relative;
	display: block;
	font-size: 12px;
	height: 25px;
	line-height: 25px;
}




#footer{
	box-sizing: border-box;
	letter-spacing: .1em;
	width: auto;
	background: #000;
	color: #fff;
	padding :50px 20px;
	font-size: 12px;
	font-weight: 100;
	line-height: 1.58;
}

#footer .site-info{
	font-size: 10px;
	margin-top: 20px;
	justify-content: space-between;
	align-items: center;
	text-align: center;}

#footer .site-info p{padding: 0;
	margin-top: 1em;
}

#footer .site-info ul{
	display : -webkit-inline-box;
	display : -ms-inline-flexbox;
	display : -webkit-inline-flex;
	display : inline-flex;
	align-items: center;}

#footer .site-info ul *{display: block;}
#footer .site-info ul a{padding: .5em;}



@media screen and (min-width: 768px) {
	#footer{padding:20px 20px 20px 50px;}
	#visi-service{padding: 60px 50px;
		border-left: 2px solid #666;
	border-right: 2px solid #666;}
	#visi-service ul{
	display: flex;
	flex-wrap: wrap;
	flex-flow:  column wrap;
	height: 150px;}
	#visi-service ul li{padding: 0;}
	#footer{width: auto;}
	#footer .site-info{display: flex;}
	#footer .site-info p{padding: 0;
	margin-bottom: 0;}
}




/*--ヘッダー変更20211217valleyin--------------------------------------------------------------------------*/
header { height: auto;}
#header{font-size:2em;line-height:1.1em;padding:10px; font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Meiryo, メイリオ, "MS P Gothic", "ＭＳ Ｐゴシック", "Hiragino Kaku Gothic Pro W3", Osaka, sans-serif;
	font-feature-settings: "palt";}
.mo_none{display:none;}
@media screen and (min-width: 768px){
	.mo_none{display:block;}
	.mo_only{display:none;}
}
#header{background-color:#fff;top:0;left:0;width:100%;position:fixed;padding:0;height:80px;z-index:10;box-sizing:border-box;}
#header .head-title-box{padding:10px; width: 60%;}
#header .head-title-box img{max-width:100%;width:175px;}
#header h1{font-size:10px;font-weight:bold; width: 100%;}
.head-info-box{font-size:12px;font-weight:bold;line-height: 1.2;}
.head-info-box .mail-box{display:flex;align-items:baseline;padding-bottom:5px;margin-bottom:8px;border-bottom:1px solid #000;}
.head-info-box .mail-box span{display:block;margin-right:10px;}
.head-info-box .mail-box a{display:block;font-size:20px;font-weight:bold;color:#00a0e9;}
.head-info-box .allarea-tel-box{display:flex;align-items:center;}
.head-info-box .allarea-tel-box span{display:block;}
.head-info-box .allarea-tel-box a{display:block;padding-top:5px;font-size:26.62px;font-weight:bold;color:#ec0f7f;}
.head-info-box .allarea-tel-box div:last-child{background-color:#0102fb;color:#fff;text-align:center;font-weight:bold;margin-left:10px;padding:5px;font-size:16px;line-height:1.5;}
.head-info-box .region-tel-box{font-size:14px;padding-top:8px;font-weight:bold;}
.head-info-box .region-tel-box span{color:#ab0000;}
#header .trigger{position:absolute;top:28px;right:15px;content:'';cursor:pointer;width:30px;height:30px;z-index:20;}
#header .trigger span{position:absolute;content:'';width:100%;height:1px;top:50%;left:0;z-index:0;-webkit-transform:translateY(-50%);transform:translateY(-50%);background-color:#4d4d4d;-webkit-transition:.3s all cubic-bezier(.17,.67,.83,.67);transition:.3s all cubic-bezier(.17,.67,.83,.67);}
#header .trigger span:nth-child(2){top:20%;}
#header .trigger span:nth-child(3){top:80%;}
.header_ec_set .icon-arrow_link:before{top:6px;	left:11px;}
.header_top { padding-top: 0px; padding-bottom: 10px; }
.inner{padding-left: 0;}

@media screen and (min-width: 768px){
	#header{height:auto;width:auto;position:static;display:flex;justify-content:space-between;align-items:center;padding:10px;box-sizing:content-box;}
	#header .head-title-box{padding:0px;}
	#header .head-title-box img{width:auto;}
	#header h1{font-size:14px;}
}
@media screen and (max-width: 768px){
	.hamgurger_list a:after {top: 17px;}
	.icon-hamburger hr{ border-top: 3px solid #fff; margin-top: 6px;}
	header h1 {margin: 8px 0 0 10px;}
	.mid_logo_area { padding-bottom: 10px;}
}
.footer_bottom .inner{ padding: 0 10px;}
.head-info-box {
	line-height: 1;
}

.head-info-box .mail-box a {
	font-size: 16px;
}
.head-info-box .mail-box {
	margin-bottom: 5px;
}
.head-info-box .allarea-tel-box div:last-child {
	padding: 3px;
	font-size: 15px;
	line-height: 1.2;
}
.head-info-box .allarea-tel-box a {
	padding-top: 3px;
	font-size: 24px;
}
.head-info-box .region-tel-box {
	padding-top: 5px;
	font-size: 13px;
}
.h_login_box{display: flex; flex-wrap: wrap; align-items: center; align-content: center; justify-content: space-around; padding: 3px 5px; font-size: 15px; margin-top: 3px;}
.h_login_box_01{ position: relative; margin: 0 5px; background: #eee; padding: 1px 5px; border-radius: 7px;}
.h_login_box_01 a{ display: flex; flex-wrap: wrap; align-items: center; align-content: center; } 
.h_login_box_01 a img { width: 22px; margin-right: 7px;}

.sp_mo_only{ display: none !important;}
@media screen and (max-width: 768px){
	.sp_mo_only{ display: block !important;}
}

.iframe-wrapper {
    position: relative;
    padding-bottom: 56.25%; /* アスペクト比16:9の場合 */
    padding-top: 30px;
    height: 0;
    overflow: hidden;
    margin-bottom: 2rem; /* YouTubeの下に余白をつける */
}
.iframe-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.print_glossary a {
    color: blue;
}

/* 20260803 インボイス記載 */
#footer .scn-footer-invoice {
	display: flex;
}

#footer .scn-footer-invoice p {
	text-align: center;
	font-size: 10px;
	padding: 20px 0 0;
}

@media screen and (max-width: 768px) {
	#footer .scn-footer-invoice {
		justify-content: center;
	}
}