@charset "UTF-8";

/**
 * コンテンツ幅制限フレックスボックス
----------------------------------------------------------------
基本 wideflex
分割 --2 --1-p --p-1
方向 -reverse
その他 -keep
----------------------------------------------------------------*/
.wideflex{
	--pc:1024;
	--tab:768;
	--sp:640;
	--legacy:375;
	
	--bp-pc:calc(1px * var(--pc));
	--bp-tab:calc(1px * var(--tab));
	--bp-sp:calc(1px * var(--sp));
	--bp-legacy:calc(1px * var(--legacy));
	
	--bp-sp:520;
	--gap-base:40;
	--gap:clamp(
		calc(1px * var(--gap-base) / 2),
		calc(var(--gap-base) / var(--bp-sp) * 100vw),
		calc(1px * var(--gap-base))
	);
	--gap-half:calc(1px * var(--gap-base) / 2);
	
	display:flex;
	flex-wrap:wrap;
	align-items:flex-start;
	gap:var(--gap);
	position:relative;
	margin:var(--gap) 0;
	--outside:calc((100% - var(--bp-pc)) / 2 + var(--gap));
	--inside:calc(var(--bp-pc) - var(--gap) * 3)
}
.wideflex > :nth-child(n){
	box-sizing:border-box;
	position:relative;
	min-width:0;
	overflow-wrap:break-word;
}
.wideflex > :nth-child(2n - 1) img{ width:100%; }
.wideflex > :nth-child(2n){ margin-right:var(--outside); }
.wideflex.-reverse > :nth-child(2n){ margin-right:0; }
.wideflex.-reverse > :nth-child(2n - 1){ margin-left:var(--outside); }
.wideflex.-reverse > :nth-child(2n - 1) img{ width:auto; }
.wideflex.-reverse > :nth-child(2n) img{ width:100%; }
.wideflex.--2 > :nth-child(2n - 1){ flex-basis:calc(var(--outside) + var(--inside) / 2); }
.wideflex.--2 > :nth-child(2n - 0){ flex-basis:calc(var(--inside) / 2); }
.wideflex.--1-p > :nth-child(2n - 1){ flex-basis:calc(var(--outside) + var(--inside) * 0.382); }
.wideflex.--1-p > :nth-child(2n - 0){ flex-basis:calc(var(--inside) * 0.618); }
.wideflex.--p-1 > :nth-child(2n - 1){ flex-basis:calc(var(--outside) + var(--inside) * 0.618); }
.wideflex.--p-1 > :nth-child(2n - 0){ flex-basis:calc(var(--inside) * 0.382); }
.wideflex.-reverse.--2 > :nth-child(2n - 1){ flex-basis:calc(var(--inside) / 2); }
.wideflex.-reverse.--2 > :nth-child(2n - 0){ flex-basis:calc(var(--outside) + var(--inside) / 2); }
.wideflex.-reverse.--1-p > :nth-child(2n - 1){ flex-basis:calc(var(--inside) * 0.618); }
.wideflex.-reverse.--1-p > :nth-child(2n - 0){ flex-basis:calc(var(--outside) + var(--inside) * 0.382); }
.wideflex.-reverse.--p-1 > :nth-child(2n - 1){ flex-basis:calc(var(--inside) * 0.382); }
.wideflex.-reverse.--p-1 > :nth-child(2n - 0){ flex-basis:calc(var(--outside) + var(--inside) * 0.618); }
@media screen and (max-width: 1200px){
	.wideflex{
		--outside:var(--gap);
		--inside:calc(100% - var(--gap) * 3)
	}
}
@media screen and (max-width: 960px){

	/* 継承しない場合は横幅を1カラム化 */
	.wideflex:not(.-keep) > :nth-child(n),
	.wideflex:not(.-keep).-reverse > :nth-child(n){ flex-basis:100%; }
	.wideflex:not(.-keep) > :nth-child(2n){ margin:0 var(--gap); }
	.wideflex:not(.-keep).-reverse > :nth-child(2n){ margin:0; }
	.wideflex:not(.-keep).-reverse > :nth-child(2n - 1){ margin:0 var(--gap); }

}

/**
 * 全体
----------------------------------------------------------------*/
.flex{ --margin:20px; }

/* フォント */

/* ボディ */
body{
	font-size:14px;
	line-height:1.6;
	color:rgb(0,0,0);
	font-family: "Hiragino Kaku Gothic ProN", Meiryo, Helvetica, sans-serif;
	background:rgb(243,245,249);
	font-feature-settings:'palt';
}

/**
 * プロトタイプ
----------------------------------------------------------------*/
img{
	display:block;
	margin:0 auto;
	max-width:100%;
}
em{ font-style:normal; }
p{ text-align:justify; }
.c{ text-align:center; }
.r{ text-align:right; }
.l{ text-align:left; }
.gm > iframe{ height:400px; }
.tel{
	color:inherit;
	text-decoration:none;
}
.relative{ position:relative; }

/* キャッチ */
.catch{
	font-size:30px;
	text-align:center;
	padding:40px;
	font-weight:bold;
	margin:20px 0;
}
.catch > strong{ color:rgb(32,64,154); }
@media screen and (max-width: 768px){
	.catch{
		font-size:20px;
		padding:40px 20px;
	}
}

/* YouTube */
.yt > a{ transition:opacity .2s; }
.yt > a.hover{ opacity:.8; }
.yt{
	position:relative;
	padding-bottom:56.25%;
	height:0;
	overflow:hidden;
}
.yt > iframe{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}

/* マージン */
.tmargin{ padding-top:80px;}
.bmargin{ padding-bottom:80px; }
.tmargin.-narrow{ padding-top:40px;}
.bmargin.-narrow{ padding-bottom:40px; }
.tmargin.-min{ padding-top:20px;}
.bmargin.-min{ padding-bottom:20px; }

/* レイアウト */
.base{
	max-width:1024px;
	margin:0 auto;
	box-sizing:border-box;
}
.base.-narrow{ max-width:768px; }
.base.-xnarrow{ max-width:512px; }
@media screen and (max-width: 768px){
	.base.-smart{ max-width:375px; }
}

/* スマート画像 */
@media screen and (max-width: 768px){
	.slim{
		max-width:450px;
		margin-right:auto !important;
		margin-left:auto !important;
	}
}

/* セーフマージン */
.safe{ padding:20px; }
.safeside{ padding:0 20px; }

/* 分岐 */
.sp{ display:none; }
@media screen and (max-width: 768px){
	.pc{ display:none; }
	.sp{ display:block; }
}

/* 水平線 */
.hr{
	display:block;
	background:#ccc;
	border:0;
	margin:10px 0;
}

/* ラベル */
.label{
	display:inline-block;
	background:rgb(32,64,154);
	color:white;
	padding:0 10px;
	font-size:90%;
	margin-right:5px;
	border-radius:1em;
	transition:opacity .2s;
}
.label.type_topics{ background:rgb(32,64,154); }
.label.type_events{ background:rgb(255,0,0); }
.label.type_mitsuwanews{ background:rgb(143,195,31); }
.label.type_pumps{ background:rgb(30,20,100); }
.label.type_strainers{ background:rgb(41,170,225); }
.label.type_demos{ background:rgb(0,0,0); }
.label.type_cases{ background:orange; }
.label:not(.nolink).hover{ opacity:.6; }
.label > a{
	display:inline-block;
	color:white;
}

/* ラベルリスト */
.labellist{
	text-align:center;
	padding:0 20px 40px;
}
.labellist > li{
	display:inline-block;
	background:rgb(41,170,225);
	color:white;
	padding:0 5px;
	margin:5px 0;
}

/* 大リスト */
.biglist > li{
	font-size:16px;
	font-weight:bold;
	margin:10px 0;
}
.biglist > li::before{
	content:'●';
	color:rgb(32,64,154);
	display:inline;
}
.biglist > li > a{
	color:rgb(0,0,0);
	transition:color .2s;
}
.biglist > li > a.hover{
	color:rgb(32,64,154);
}

/* スクロール */
.scrollable{
	transition:opacity 1s;
	opacity:0;
}
.scrollable.scrolled{ opacity:1; }
 
/* 汎用クローズボタン */
.close{
	background:rgb(30,20,100) url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/interface/icons/close.png") scroll no-repeat center center / contain;
	width:30px;
	height:30px;
	border:2px solid white;
	border-radius:50%;
	transition:background-color .2s;
	display:block;
	position:absolute;
	top:-10px;
	right:-10px;
	cursor:pointer;
}
.close.hover{ background-color:rgb(32,64,154); }

/* 新商品 */
.new{
	background:rgb(255,0,0);
	color:white;
	position:absolute;
	top:-6px;
	left:-6px;
	display:inline-block;
	padding:2px 10px;
	font-size:12px;
	font-weight:bold;
	z-index:1;
}

/* ギャラリー */
.gallery figure{
	border:1px solid white;
	margin:0;
}
.gallery figure > img{
	max-width:none;
	width:100%;
}

/* キャプション */
.caption{
	padding:20px 0 10px;
	font-weight:bold;
	font-size:16px;
	color:rgb(32,64,154);
}
.caption::before{ content:'■'; }

/* テーブル */
.table{ width:100%; }
.table thead{
	background:rgb(210,216,234);
	font-weight:bold;
}
.table th,
.table td{
	border-top:1px solid rgb(142,137,177);
	border-bottom:1px solid rgb(142,137,177);
	padding:10px;
}
.table th{ background:rgb(232,235,244); }
.table.head100 th:first-child{ width:100px; }
.table.head150 th:first-child{ width:150px; }
.table.head200 th:first-child{ width:200px; }

/* アイコンカード */
.iconcards > section{
	display:flex;
	gap:10px;
}
.iconcards > section > figure{ flex-basis:100px; }
.iconcards > section > div{ flex-basis:100%; }
.iconcards > section > div > h2,
.iconcards > section > div > h3,
.iconcards > section > div > h4,
.iconcards > section > div > h5,
.iconcards > section > div > h6{
	font-size:120%;
	font-weight:bold;
	margin-bottom:5px;
}
.iconcards > section > div > h2 > small,
.iconcards > section > div > h3 > small,
.iconcards > section > div > h4 > small,
.iconcards > section > div > h5 > small,
.iconcards > section > div > h6 > small{
	font-size:80%;
	font-weight:normal;
	color:rgb(41,170,225);
	display:block;
}

/* 電話ボックス */
.telbox{
	text-align:center;
	padding:20px;
}
.telbox > a{
	background:rgb(32,64,154);
	color:white;
	max-width:512px;
	margin:0 auto;
	display:block;
	padding:30px;
	border-radius:10px;
	box-sizing:border-box;
	position:relative;
}
.telbox > a::before{
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	content:'';
	display:block;
	border:1px solid white;
	border-radius:9px;
	margin:5px;
	transition:backgrounx .2s;
}
.telbox > a.hover{ background:rgb(-80,-32,103); }
.telbox > a > p{
	font-size:35px;
	font-weight:bold;
	text-align:center;
}
.telbox > a > p::before{
	content:'';
	background:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/interface/icons/tel.png") scroll no-repeat center center / contain;
	display:inline-block;
	width:40px;
	height:40px;
	vertical-align:middle;
}
@media screen and (max-width: 768px){
	.telbox > a > p{ font-size:24px; }
	.telbox > a > p::before{
		width:30px;
		height:30px;
	}
}

/* 通常リスト */
.normallist > li{ text-align:justify; }
.normallist.big > li{ font-size:150%; }
.normallist.c > li{ text-align:center; }
.normallist > li:before{
	content:'●';
	color:rgb(32,64,154);
}
@media screen and (max-width: 768px){
	.normallist.big > li{ font-size:120%; }
}

/* 番号付きリスト */
.numberlist{
	counter-reset:number;
	margin:10px 0;
}
.numberlist > li{ padding:6px 0; }
.numberlist > li:before{
	counter-increment:number;
	content:counter(number);
	background:rgb(0,0,0);
	color:white;
	margin-right:4px;
	font-size:12px;
	line-height:20px;
	text-align:center;
	width:20px;
	height:20px;
	display:inline-block;
}

/* インラインリスト */
.inlinelist > li{
	display:inline;
	text-align:justify;
}
.inlinelist > li:not(:last-child){ margin-right:5px; }
.inlinelist > li:before{
	content:'●';
	color:rgb(32,64,154);
}

/* 段組み */
.multicolumn{ column-count:2; }
@media screen and (max-width: 768px){
	.multicolumn{ column-count:1; }
}

/* グリッド */
.grid > section{
	padding-bottom:40px;
	position:relative;
}
.grid > section > figure{ margin-bottom:10px; }
.grid > section > figure > a{ transition:opacity .2s; }
.grid > section > figure > a.hover{ opacity:.7; }
.grid > section > h2,
.grid > section > h3,
.grid > section > h4,
.grid > section > h5,
.grid > section > h6{
	font-size:120%;
	font-weight:bold;
	margin-bottom:10px;
}
.grid > section > h2 > small,
.grid > section > h3 > small,
.grid > section > h4 > small,
.grid > section > h5 > small,
.grid > section > h6 > small{
	font-size:80%;
	font-weight:normal;
	color:rgb(41,170,225);
	display:block;
}
.grid.numbering{ counter-reset:number; }
.grid.numbering > section > h2,
.grid.numbering > section > h3,
.grid.numbering > section > h4,
.grid.numbering > section > h5,
.grid.numbering > section > h6{
	position:relative;
	padding-left:34px;
}
.grid.numbering > section > h2::before,
.grid.numbering > section > h3::before,
.grid.numbering > section > h4::before,
.grid.numbering > section > h5::before,
.grid.numbering > section > h6::before{
	counter-increment:number;
	content:counter(number) ". ";
	content:counter(number);
	color:rgb(32,64,154);
	background:rgb(32,64,154);
	color:white;
	border-radius:50%;
	margin-right:4px;
	font-size:12px;
	line-height:28px;
	text-align:center;
	width:28px;
	height:28px;
	top:0;
	left:0;
	display:block;
	position:absolute;
}

/* インラインボタン */
.inlinebuttons{ margin:5px 0; }
.inlinebuttons > a{
	display:inline-block;
	background:rgb(32,64,154);
	color:white;
	padding:2px 10px 2px 34px;
	border-radius:1em;
	font-size:16px;
	font-weight:bold;
	position:relative;
	transition:background .2s;
	margin:3px 0;
}
.inlinebuttons > a.hover{ background:rgb(30,20,100); }
.inlinebuttons > a::before{
	content:'';
	display:inline-block;
	background:scroll no-repeat center center / contain;
	width:29px;
	height:29px;
	position:absolute;
	top:0;
	left:5px;
}
.inlinebuttons > a.icon_tel::before{ background-image:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/interface/icons/tel.png"); }
.inlinebuttons > a.icon_fax::before{ background-image:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/interface/icons/fax.png"); }
@media screen and (max-width: 768px){
	.inlinebuttons > a{
		display:block;
		text-align:center;
		margin:5px 0;
	}
}

/* 言語ラベル */
.langs{ padding:10px 0; }
.langs > div{
	font-size:14px;
	display:inline-block;
	background:white;
	padding:2px 10px;
	border-radius:1em;
}
.langs > div.jpn{ background:rgb(148,212,240); }
.langs > div.eng{ background:#ffb2b2; }

/* ボタン */
.buttons{
	text-align:center;
	padding:10px;
}
.buttons.right{
	text-align:right;
	padding:0;
}
.button{
	display:inline-block;
	border-radius:10px;
	font-size:18px;
	font-weight:bold;
	padding:15px 30px;
	color:white;
	margin:10px;
	transition:background .2s, color .2s;
	box-sizing:border-box;
}
.button.min{
	font-size:14px;
	padding:8px 20px;
	border-radius:4px;
}
.button.big{
	font-size:24px;
	padding:10px 30px;
	border-radius:4px;
}
.button.disabled{
	background:#aaa;
}
.button{ background:rgb(30,20,100); }
.button.green{ background:rgb(143,195,31); }
.button.red{ background:rgb(255,0,0); }
.button.blue{ background:rgb(32,64,154); }
.button.water{ background:rgb(41,170,225); }
.button.white{ background:white; color:rgb(30,20,100); }
.button.hover{ background:rgb(32,64,154); }
.button.green.hover{ background:rgb(31,135,-193); }
.button.red.hover{ background:rgb(255,102,102); }
.button.blue.hover{ background:rgb(30,20,100); }
.button.water.hover{ background:rgb(32,64,154); }
.button.white.hover{ background:rgb(30,20,100); color:white; }
.button.outline{
	background:none;
	border:2px solid;
}
.button.outline{ border-color:rgb(30,20,100); color:rgb(30,20,100); }
.button.outline.green{ border-color:rgb(143,195,31); color:rgb(143,195,31); }
.button.outline.red{ border-color:rgb(255,0,0); color:rgb(255,0,0); }
.button.outline.blue{ border-color:rgb(32,64,154); color:rgb(32,64,154); }
.button.outline.water{ border-color:rgb(41,170,225); color:rgb(41,170,225); }
.button.outline.white{ border-color:white; color:white; }
.button.outline.hover{ background:rgba(30,20,100,0.2); }
.button.outline.hover.green{ background:rgba(143,195,31,0.2); }
.button.outline.hover.red{ background:rgba(255,0,0,0.2); }
.button.outline.hover.blue{ background:rgba(32,64,154,0.2); }
.button.outline.hover.water{ background:rgba(41,170,225,0.2); }
.button.outline.hover.white{ background:rgba(255,255,255,.2); }
@media screen and (max-width: 768px){
	.button{
		font-size:16px;
		padding:10px 20px;
	}
}

/* メインビジュアル */
.mvis img{
	max-width:none;
	width:100%;
}

/* reCATPCHA */
.grecaptcha-badge{ visibility:hidden; }

/* ギャラリー */
.gallery img{
	max-width:none;
	width:100%;
}
.gallery.border > *:not(:last-child){
	border-right:2px solid white;
}

/* 背景 */
.bg_white{ background:white; }
.bg_blackblue{
	background:rgb(30,30,40);
	color:white;
}
.bg_blue{
	background:rgb(32,64,154);
	color:white;
}
.bg_pastelblue{ background:rgb(243,245,249); }
.bg_products{ background:white url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/article/pumps/bg_product.png") scroll no-repeat center top / contain; }
@media screen and (max-width: 768px){
	.bg_products{ background-image:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/article/pumps/bg_product_sp.png"); }
}

/* note */
.notebanner{
	background:white;
	transition:opacity .2s;
	display:block;
}
.notebanner.hover{ opacity:.7; }

/* 告知 */
.notice{
	background:rgb(32,64,154);
	color:white;
	padding:40px 20px;
	text-align:center;
	font-size:28px;
	font-weight:bold;
}
.notice > strong{ color:yellow; }
@media screen and (max-width: 768px){
	.notice{
		font-size:20px;
		text-align:left;
	}
}

/* 見出し */
.h2{
	font-size:24px;
	text-align:center;
	line-height:1.4;
	padding:80px 20px 20px;
	letter-spacing:.2em;
}
.h2 > small{
	font-size:16px;
	display:block;
	color:rgb(32,64,154);
}
.h2::before{
	content:'';
	display:block;
	border-top:10px solid rgb(32,64,154);
	padding-bottom:20px;
}
.h3{
	font-size:20px;
	font-weight:bold;
	margin-bottom:10px;
}
.h3 > strong{
	font-size:150%;
	color:rgb(32,64,154);
}
.h3_big{
	font-size:28px;
	font-weight:bold;
	color:rgb(30,20,100);
	padding-bottom:10px;
}
.h3_square{
	font-size:24px;
	font-weight:bold;
	color:rgb(30,20,100);
	padding:40px 20px 20px;
}
.h3_square::before{ content:'■'; }
.h4{
	font-size:16px;
	font-weight:bold;
	margin:5px 0;
}

/* 文章 */
.summary{
	font-size:16px;
	text-align:center;
	padding:20px 20px 40px;
}

/* 一文 */
.asentence{
	padding:20px;
	font-size:18px;
	font-weight:bold;
	text-align:center;
}

/* 注意書き */
.cautions > li{
	padding-left:55px;
	position:relative;
	background:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/interface/icons/caution.png") scroll no-repeat left top / 50px;
	box-sizing:border-box;
	min-height:60px;
}

/* 水平線 */
.hr{
	border:1px solid #ccc;
	margin:20px 0;
}

/* 脚注 */
.note{
	background:rgba(32,64,154,0.1);
	padding:10px;
	margin:25px 0 20px;
	font-size:12px;
	position:relative;
}
.note > h2,
.note > h3,
.note > h4,
.note > h5,
.note > h6{
	position:absolute;
	top:-14px;
	left:10px;
	line-height:20px;
	border-radius:10px;
	font-weight:bold;
	background:rgb(32,64,154);
	color:white;
	padding:0 10px;
	display:block;
}

/* 補足 */
@media screen and (min-width: 769px){
	.complement{
		background:rgb(105,195,234);
		color:white;
		padding:10px;
		border-radius:10px;
		position:absolute;
		top:30px;
		right:20px;
		line-height:1.2;
	}
	.complement > dd{
		font-size:16px;
		font-weight:bold;
	}
}
@media screen and (max-width: 768px){
	.complement{
		border-radius:6px;
		line-height:1.2;
		margin:0 20px;
		display:flex;
		box-sizing:border-box;
		border:1px solid rgb(105,195,234);
	}
	.complement > dt{
		background:rgb(105,195,234);
		color:white;
		padding:6px;
		font-size:12px;
	}
	.complement > dd{
		padding:6px;
		font-size:12px;
		font-weight:bold;
		color:rgb(105,195,234);
	}
}

/* カードスライダー */
.cardslider{
	overflow-x:scroll;
	-webkit-overflow-scrolling:touch;
}
.cardslider > div{
	display:flex;
	padding:10px;
	width:fit-content;
}
.cardslider > div > section{
	padding:10px;
	box-sizing:border-box;
}
.cardslider > div > section > a{
	display:block;
	box-sizing:border-box;
	padding:20px;
	transition:background .2s, border-color .2s, opacity .2s;
}

/* 目次 */
.conttable{
	margin:20px;
}
.conttable > a{
	display:block;
	padding:4px 0;
	color:white;
	color:rgb(32,64,154);
	font-size:18px;
	font-weight:bold;
}
.conttable > a::before{ content:'●'; }
.conttable > a:hover{ color:rgb(41,170,225); }

/* 求人票 */
.vote > header{
	font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	display:flex;
	flex-direction:column;
	align-items:center;
	text-align:center;
}
.vote > header > h3{
	font-size:300%;
	color:rgb(32,64,154);
	margin:30px 0;
}
.vote > header > h3 > small{ font-size:60%; }
.vote > header > figure{ max-width:488px; }
.vote > header > div{ margin-top:-40px; }
.vote > header > div > p{
	background:rgb(32,64,154);
	color:white;
	font-size:200%;
	text-align:center;
	display:inline-block;
	margin-bottom:10px;
	padding:0 10px;
}
.vote > section > h4{
	color:rgb(32,64,154);
	font-weight:bold;
	font-size:140%;
	margin:40px 0 20px;
}
.vote > section > p{
	font-size:120%;
	font-weight:bold;
}
.vote > section:first-of-type > h4{
	border-bottom:2px solid rgb(32,64,154);
	font-size:200%;
	text-align:center;
}
.vote > section:first-of-type > p{
	font-size:150%;
	line-height:2;
	text-align:center;
}
.vote > table{
	border-top:2px solid rgb(32,64,154);
	margin:40px 0;
	width:100%;
}
.vote > table th,
.vote > table td{ border-bottom:2px solid rgb(32,64,154); }
.vote > table th{
	background:rgb(143,159,204);
	text-align:center;
	color:white;
	font-weight:bold;
	min-width:80px;
}
.vote > table th,
.vote > table td{ padding:5px 10px; }
@media screen and (max-width: 768px){
	.vote > header > div > p{ font-size:140%; }
	.vote > section:first-of-type > h4{ font-size:140%; }
	.vote > section:first-of-type > p{ font-size:120%; }
}

/* タグ */
.tags{ margin:20px 0; }
.tags > li{
	background:#ccc;
	border-radius:10px;
	padding:4px 10px;
	display:inline-block;
	margin-bottom:10px;
}
.tags > li:not(:last-child){ margin-right:5px; }

/* タイムライン */
.timeline{ margin:60px 20px; }
.timeline > section{
	background:rgba(255,255,255,.8);
	transition:background .2s;
	line-height:2;
	margin:40px 0;
}
.timeline.archive > section{ background:none; }
.timeline.archive > section > a{
	display:block;
	color:rgb(0,0,0);
	background:white;
	padding:20px;
	margin-top:10px;
	transition:box-shadow .2s;
}
.timeline.archive > section > a.hover{ box-shadow:0 0 10px rgba(0,0,0,.1); }
.timeline > section > header{
	background:rgb(32,64,154);
	color:white;
	padding:10px 15px 1px;
}
.timeline > section > header > date{ font-weight:bold; }
.timeline > section > .flex{
	padding:30px;
	flex-wrap:nowrap;
	flex-direction:row-reverse;
}
.timeline > section > .flex > figure{
	max-width:300px;
	margin-left:20px;
}
@media screen and (max-width: 768px){
	.timeline > section > .flex{
		display:block;
		padding:30px 20px;
	}
	.timeline > section > .flex > figure{
		max-width:400px;
		margin:0 auto 10px;
	}
}

/* ページャー */
.pager > ul{
	padding:20px;
	text-align:center;
}
.pager > ul > li{ display:inline-block; }
.pager > ul > li > *{
	width:20px;
	padding:10px;
	text-align:center;
	display:inline-block;
}
.pager > ul > li > span{ background:rgb(232,235,244); }
.pager > ul > li > a{
	background:rgb(32,64,154);
	color:white;
	transition:background .2s;
}
.pager > ul > li > a.hover{ background:rgb(30,20,100); }
.pager > ul > li:first-child > *{ border-radius:4px 0 0 4px; }
.pager > ul > li:last-child > *{ border-radius:0 4px 4px 0; }

/* ダウンロードリスト */
.dllist{
	display:flex;
	gap:20px;
}
.dllist > :first-child{ flex-basis:100%; }
.dllist > :last-child{ flex-basis:300px; }
@media screen and (max-width: 768px){
	.dllist{ display:block; }
}

/**
 * ヘッドカード
----------------------------------------------------------------*/
/* ヘッダーカード */
#hcard{
	display:flex;
	position:relative;
	background:white;
}
@media screen and (max-width: 768px){
	#hcard{ display:block; }
}

/* ロゴ */
#logo > a{
	width:360px;
	display:block;
	transition:opacity .2s;
}
#logo > a.hover{ opacity:.7; }
@media screen and (max-width: 1350px){
	#logo > a{
		position:absolute;
		top:0;
		left:0;
	}
}
@media screen and (max-width: 768px){
	#logo > a{
		position:static;
		width:180px;
	}
}

/* スマホメニュー領域 */
@media screen and (min-width: 769px){
	#menu{ flex:1; }
	#menu > #navs{
		display:flex;
		flex-direction:column;
		justify-content:flex-end;
		height:100%;
	}
}
@media screen and (max-width: 768px){
	#menu{
		display:none;
		background:rgba(30,20,100,0.9);
		position:fixed;
		top:0;
		left:0;
		right:0;
		bottom:0;
		overflow-y:scroll;
		-webkit-overflow-scrolling:touch;
		z-index:10000;
	}
	body.clicked #menu{ display:block; }
}

/* お問い合わせ */
#contact{
	width:200px;
	box-sizing:border-box;
	padding:10px;
	background:rgb(0,0,0);
	font-size:18px;
	color:white;
	text-align:center;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	transition:background .2s;
}
#contact.hover{ background:rgb(30,20,100); }
@media screen and (max-width: 1405px){
	#contact{ width:140px; }
}
@media screen and (max-width: 768px){
	#contact{ display:none; }
}

/* ハンバーガーメニュー */
@media screen and (max-width: 768px){
	#open{
		position:fixed;
		top:0;
		right:0;
		background:rgba(255,255,255,.5);
		border:0;
		width:50px;
		transition:background .2s;
		z-index:1000;
		cursor:pointer;
	}
	#open.hover{ background:rgba(32,64,154,0.5); }
}

/* クローズボタン */
@media screen and (max-width: 768px){
	#close{
		position:fixed;
		top:0;
		right:0;
		background:rgba(255,255,255,.5);
		border:0;
		width:50px;
		transition:background .2s;
		z-index:1000;
		cursor:pointer;
	}
	#close.hover{ background:white; }
}

/**
 * グローバルナビゲーション
----------------------------------------------------------------*/
@media screen and (min-width: 769px){
	#gnav > ul{
		display:flex;
		justify-content:flex-end;
		padding:0 4px;
		z-index:1000;
	}
	#gnav > ul > li > a{
		display:block;
		font-size:16px;
		color:rgb(0,0,0);
		padding:4px 16px;
		font-weight:bold;
		transition:background .2s, color .2s;
		position:relative;
	}
	#gnav > ul > li > a::after{
		content:'';
		display:block;
		position:absolute;
		left:0;
		right:0;
		bottom:0;
		margin:auto;
		width:0;
		height:2px;
		background:white;
		transition:width .2s;
		border-radius:1px;
	}
	#gnav > ul > li:hover > a,
	#gnav > ul > li > a.hover{
		background:rgba(30,20,100,0.9);
		color:white;
	}
	#gnav > ul > li > a.hover::after{ width:60%; }
	#gnav > ul > li > ul{
		display:none;
		position:absolute;
		left:0;
		right:0;
		background:rgba(30,20,100,0.9);
	}
	#gnav > ul > li:hover > ul,
	#gnav > ul > li > a.hover ~ ul{ display:flex; }
}
@media screen and (min-width: 769px) and (max-width: 1000px){
	#gnav > ul > li > a{ padding:4px 8px; }
}

/**
 * グローバルナビゲーション：サブメニュー
----------------------------------------------------------------*/
@media screen and (min-width: 769px){
	#gnav > ul > li > ul{ padding:20px; }
	#gnav > ul > li > ul{ justify-content:center; }
	#gnav > ul > li:not(.imagemenu) > ul{ flex-wrap:wrap; }
	#gnav > ul > li > ul > li > a{
		color:white;
		display:block;
		box-sizing:border-box;
		padding:10px;
		transition:background .2s;
	}
	#gnav > ul > li:not(.imagemenu) > ul > li > a{ width:288px; }
	#gnav > ul > li.imagemenu > ul > li > a{ max-width:288px; }
	#gnav > ul > li.imagemenu > ul > li > a > p{
		font-size:16px;
		text-align:center;
		padding:4px;
	}
	#gnav > ul > li:not(.imagemenu) > ul > li > a{
		border-bottom:1px solid white;
		margin:10px;
	}
	#gnav > ul > li > ul > li > a:hover{ background:rgba(255,255,255,.3); }
}
@media screen and (max-width: 768px){
	#gnav{ padding-top:50px; }
	#gnav > ul a{
		display:block;
		padding:10px;
	}
	#gnav > ul > li > ul{
		display:flex;
		flex-wrap:wrap;
	}
	#gnav > ul > li > a{
		background:rgb(0,0,0);
		color:white;
		border-bottom:1px solid white;
		border-top:1px solid white;
		margin-top:-1px;
		font-weight:bold;
		text-align:center;
		transition:background .2s, color .2s;
	}
	#gnav > ul > li > a.hover{
		background:white;
		color:rgb(30,20,100);
	}
	#gnav > ul > li > ul > li{ width:50%; }
	#gnav > ul > li > ul > li > a{
		color:white;
		height:100%;
		box-sizing:border-box;
		border-bottom:1px solid white;
		transition:background .2s;
	}
	#gnav > ul > li > ul > li > a.hover{ background:rgba(255,255,255,.3); }
	#gnav > ul > li > ul > li > a > p{
		text-align:center;
		padding-top:4px;
	}
	#gnav > ul > li > ul > li:nth-child(odd) > a{ border-right:1px solid white; }
}

/**
 * プライマリナビゲーション
----------------------------------------------------------------*/
@media screen and (min-width: 769px){
	#pnav > ul{
		display:flex;
		flex-wrap:wrap;
		justify-content:flex-end;
		padding:0 4px;
	}
	#pnav > ul > li > a{
		border:1px solid rgb(0,0,0);
		border-radius:1em;
		font-size:16px;
		padding:4px 20px;
		color:rgb(0,0,0);
		letter-spacing:.1em;
		text-align:center;
		display:inline-block;
		margin:4px;
		transition:border-color .2s, background .2s;
	}
	#pnav > ul > li > a::before{
		background:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/interface/icons/arrow.png") scroll no-repeat center center / contain;
		content:'';
		display:inline-block;
		width:12px;
		height:12px;
		margin-top:-4px;
		vertical-align:middle;
	}
	#pnav > ul > li > a.hover{
		border-color:rgb(32,64,154);
		background:rgb(232,235,244);
	}
}
@media screen and (min-width: 769px) and (max-width: 1350px){
	#pnav{
		height:100px;
		display:flex;
		flex-direction:column;
		justify-content:flex-end;
		padding-left:360px;
	}
}
@media screen and (max-width: 768px){
	#pnav{ display:none; }
}

/**
 * CTA
----------------------------------------------------------------*/
#cta{
	position:fixed;
	left:0;
	right:0;
	bottom:0;
	background:rgb(30,20,100);
	z-index:1100;
	font-size:0;
	text-align:center;
}
#cta > .base{ display:flex; }
#cta > .base > .tel{ display:inline-block; }
#cta > .base > div{
	display:flex;
	justify-content:center;
	padding:0 6px;
}
#cta > .base > div > a{
	border-radius:10px;
	display:inline-block;
	margin:12px 6px;
	transition:background .2s;
}
#cta > .base > div > .mail{ background:rgb(255,0,0); }
#cta > .base > div > .download{ background:rgb(143,195,31); }
#cta > .base > div > .mail.hover{ background:rgb(255,102,102); }
#cta > .base > div > .download.hover{ background:rgb(87,165,-81); }
@media screen and (max-width: 768px){
	#cta{
		padding:20px 0;
		position:static;
		background:none;
	}
	#cta > .base{ display:block; }
}

/**
 * ポップアップ
----------------------------------------------------------------*/
#popup{
	position:fixed;
	bottom:-500px;
	right:20px;
	background:white;
	z-index:1000;
	padding-bottom:70px;
	width:300px;
	text-align:center;
	box-shadow:0 0 4px rgba(0,0,0,.1);
	border:1px solid rgb(30,20,100);
	box-sizing:border-box;
	transition:bottom 1s;
}
#popup.active{ bottom:0; }
#popup > h3{
	background:rgb(30,20,100);
	color:white;
	font-weight:bold;
	font-size:20px;
	padding:10px;
}
#popup > div{ padding:20px 10px; }
#popup > a{
	display:inline-block;
	background:rgb(255,0,0);
	border-radius:10px;
	margin-bottom:10px;
	transition:background .2s;
}
#popup > a.hover{ background:rgb(255,102,102); }
@media screen and (max-width: 768px){
	#popup{
		right:0;
		left:0;
		border:0;
		width:auto;
		padding-bottom:0;
	}
	#popup > h3{
		font-size:16px;
		padding:2px 10px;
	}
	#popup > div{
		padding:10px;
		position:relative;
	}
	#popup > div > figure{
		position:absolute;
		left:10px;
		top:10px;
		bottom:10px;
		width:120px;
	}
	#popup > div > p{ margin:0 0 0 130px; }
	#popup > a{
		display:block;
		max-width:calc(100vw - 150px);
		margin-left:140px;
	}
	#popup > button{ right:10px; }
}

/**
 * フッター
----------------------------------------------------------------*/
/* フッターカード */
#fcard{
	background:url('https://mitsuwapump.jp/wp-content/uploads/2020/11/bg_footer.png') scroll no-repeat center center / cover;
	padding:40px 0;
}

/* フッターロゴ */
#flogo{
	max-width:180px;
	margin:0 auto;
}

/* フッター会社概要 */
#fcom{
	color:white;
	text-align:center;
	padding:10px 20px;
}
#fcom > p{ text-align:center; }
#fcom > a{ color:white; }

/* 著作家表記 */
#cr{
	background:rgb(0,0,0);
	color:white;
	text-align:center;
	padding:4px 20px 74px 20px;
	font-size:13px;
}
@media screen and (max-width: 768px){
	#cr{ padding-bottom:4px; }
}

/**
 * メインコンテンツ
----------------------------------------------------------------*/
#cont{ min-height:500px; }

/**
 * メインコンテンツヘッダー
----------------------------------------------------------------*/
/* ページ名 */
body > main > header{
	padding:20px;
	box-sizing:border-box;
	color:white;
	height:300px;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	background:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/interface/theme/bg_cvis01.png") scroll no-repeat center center / cover;
}
body.page-id-24 > main > header,
body.post-type-archive-strainers > main > header,
body.single-strainers > main > header{
	color:rgb(0,0,0);
	background-image:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/interface/theme/bg_cvis02.png");
}
body > main > header > h1{
	font-size:30px;
	font-weight:bold;
	letter-spacing:.2em;
}
@media screen and (max-width: 768px){
	body > main > header{
		height:150px;
		background-image:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/interface/theme/bg_cvis01_sp.png");
	}
	body.page-id-24 > main > header,
	body.post-type-archive-strainers > main > header,
	body.single-strainers > main > header{ background-image:; }
	body > main > header > h1{ font-size:20px; }
}

/* パン屑リスト */
#pan > ol > li{ display:inline; }
#pan > ol > li:not(:last-child)::after{ content:'>'; }
#pan > ol > li > a{
	color:white;
	transition:color .2s;
}
#pan > ol > li > a.hover{ color:rgb(41,170,225); }
body.page-id-24 > main > header #pan > ol > li > a,
body.post-type-archive-strainers > main > header #pan > ol > li > a,
body.single-strainers > main > header #pan > ol > li > a{ color:rgb(0,0,0); }
body.page-id-24 > main > header #pan > ol > li > a.hover,
body.post-type-archive-strainers > main > header #pan > ol > li > a.hover,
body.single-strainers > main > header #pan > ol > li > a.hover{ color:rgb(41,170,225); }
@media screen and (max-width: 768px){
	#pan > ol > li > a{ font-size:12px; }
}

/**
 * メインコンテンツフッター
----------------------------------------------------------------*/
#relnav{
	background:white;
	background:rgb(210,216,234);
	padding:20px 0 40px;
}
#relnav > .base > h2{
	font-size:24px;
	letter-spacing:.2em;
	text-align:center;
	padding:20px;
}
@media screen and (max-width: 768px){
	#relnav > .base > h2{ font-size:16px; }
}

/**
 * スポット：TOPページ
----------------------------------------------------------------*/
/* バナー */
.banners{
	text-align:center;
	padding:30px 20px 60px;
}
.banners > a{
	transition:opacity .2s;
	display:inline-block;
}
.banners > a.hover{ opacity:.7; }

/* メインビジュアル */
#spot_index_mvis{
	background:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/article/index/mvis.png") scroll no-repeat center center / cover;
	height:768px;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
}
@media screen and (max-width: 768px){
	#spot_index_mvis{
		background:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/article/index/mvis_sp.png");
		height:512px;
	}
}

/* メインパネル */
#spot_index_mainpanel{ margin-top:-100px; }
#spot_index_mainpanel > .flex > section{
	background:white;
	position:relative;
}
#spot_index_mainpanel > .flex > section > a{ display:block; }
#spot_index_mainpanel > .flex > section > a > figure{ transition:opacity .2s; }
#spot_index_mainpanel > .flex > section > a.hover > figure{ opacity:.7; }
#spot_index_mainpanel > .flex > section > a > h3{
	padding:20px;
	text-align:center;
	font-size:20px;
	font-weight:bold;
	line-height:1;
	color:rgb(0,0,0);
	transition:background .2s;
}
#spot_index_mainpanel > .flex > section > a.hover > h3{ background:#f5f5f5; }
#spot_index_mainpanel > .flex > section > a > h3 > small{
	font-size:14px;
	color:rgb(30,20,100);
}
#spot_index_mainpanel > .flex > section > ul{
	position:absolute;
	left:0;
	right:0;
	z-index:1;
}
#spot_index_mainpanel > .flex > section > ul > li > a{
	display:block;
	text-align:center;
	color:rgb(30,20,100);
	overflow:hidden;
	height:0;
	line-height:40px;
	box-sizing:border-box;
	background:white;
	transition:background .2s, height .2s, border .2s, padding .2s;
}
#spot_index_mainpanel > .flex > section > a.hover + ul > li > a,
#spot_index_mainpanel > .flex > section > ul:hover > li > a{
	height:40px;
	padding:0 20px;
	border-top:1px solid #ccc;
}
#spot_index_mainpanel > .flex > section > ul > li > a.hover{ background:#f5f5f5; }
@media screen and (max-width: 768px){
	#spot_index_mainpanel{
		padding:0 20px;
		max-width:512px;
		margin:-100px auto 40px;
	}
	#spot_index_mainpanel > .flex > section > ul{ position:static; }
	#spot_index_mainpanel > .flex > section > ul > li > a{
		height:40px;
		padding:0 20px;
		border-top:1px solid #ccc;
	}
}

/* ストレーナー事業譲渡のお知らせ */
#ban_transfer_strainers > .safe > div{
	background:white url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/interface/theme/loopbg_grid.png") scroll repeat center center;
	/*
	border:1px solid rgb(0,0,0);
	*/
	margin-bottom:40px;
	padding-bottom:20px;
}

/* マジカルポンプパネル */
#spot_index_magicalpanel{ margin:40px 0; }
#spot_index_magicalpanel > .flex > section{
	display:flex;
	flex-direction:column;
	position:relative;
}
#spot_index_magicalpanel > .flex > section:first-child{
	background:rgb(0,0,0);
	align-items:flex-end;
}
#spot_index_magicalpanel > .flex > section:last-child{ background:rgb(227,227,229); }
#spot_index_magicalpanel > .flex > section > div{ max-width:768px; }
#spot_index_magicalpanel > .flex > section > div > .buttons{
	position:absolute;
	bottom:40px;
	left:0;
	right:0;
}
#spot_index_magicalpanel > .flex > section > div > .buttons > .button{ padding:20px 60px; }
@media screen and (max-width: 768px){
	#spot_index_magicalpanel > .flex > section > div > .buttons > .button{ padding:10px 60px; }
}

/* リードコピー */
#spot_index_leadcopy{
	background:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/article/index/bg_leadcopy.png") scroll no-repeat center center / cover;
	padding:40px;
}
#spot_index_leadcopy > div{
	background:rgba(30,20,100,0.8);
	max-width:500px;
	padding:40px;
	color:white;
	line-height:1.8;
}
#spot_index_leadcopy > div > h3{
	font-size:22px;
	color:rgb(83,187,231);
}
#spot_index_leadcopy > div > h2{
	font-size:26px;
	line-height:1.5;
	padding-bottom:5px;
}
@media screen and (max-width: 768px){
	#spot_index_leadcopy{
		background-image:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/article/index/bg_leadcopy_sp.png");
		padding:0;
	}
	#spot_index_leadcopy > div{
		padding:40px 20px;
		background:rgba(32,64,154,0.8);
		max-width:none;
	}
	#spot_index_leadcopy > div > h3{ font-size:16px; }
	#spot_index_leadcopy > div > h2{ font-size:22px; }
}

/* USP */
#spot_index_usp > .flex > figure > a > img{ transition:opacity .2s; }
#spot_index_usp > .flex > figure > a.hover > img{ opacity:.7; }

/* タイムライン */
#spot_index_timeline > .safe > section > a{
	padding:10px 60px 10px 10px;
	display:block;
	position:relative;
	transition:background .2s;
	color:rgb(0,0,0);
}
#spot_index_timeline > .safe > section:not(:last-child) > a{ border-bottom:1px solid #ccc; }
#spot_index_timeline > .safe > section > a::after{
	content:'';
	display:block;
	position:absolute;
	top:0;
	bottom:0;
	right:0;
	width:40px;
	background:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/interface/icons/arrow.png") scroll no-repeat center center / 20px;
}
#spot_index_timeline > .safe > section > a.hover{ background:white; }
#spot_index_timeline > .safe > section > a > h3{
	font-size:18px;
	font-weight:bold;
}

/* 製品紹介 */
#spot_index_products > header{
	background:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/article/index/bg_products.png") scroll no-repeat center center / cover;
	height:300px;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
}
#spot_index_products > header > h2{
	color:white;
	font-size:24px;
	text-align:center;
	line-height:1.4;
	letter-spacing:.2em;
}
#spot_index_products > header > h2 > small{
	font-size:16px;
	display:block;
}
#spot_index_products > .cardslider{ margin-top:-60px;}
#spot_index_products > .cardslider > div > section{ width:370px; }
#spot_index_products > .cardslider > div > section > a{
	border:2px solid rgb(0,0,0);
	color:rgb(0,0,0);
	position:relative;
	z-index:10;
	background:white;
}
#spot_index_products > .cardslider > div > section > a.hover{
	background-size:100%;
	border-color:rgb(32,64,154);
	border-color:rgba(255,255,255,0);
	box-shadow:0 0 10px white;
}
#spot_index_products > .cardslider > div > section > a > aside{
	background:scroll no-repeat center center / 250%;
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	z-index:-1;
	opacity:.1;
	transition:opacity .2s;
}
#spot_index_products > .cardslider > div > section > a.hover > aside{
	opacity:.2;
}
#spot_index_products > .cardslider > div > section > a > h3{
	font-size:20px;
	font-weight:bold;
	text-align:center;
	margin-bottom:20px;
}
#spot_index_products > .cardslider > div > section > a > h3 > small{
	font-size:13px;
	display:block;
	font-weight:normal;
	color:rgb(41,170,225);
}
#spot_index_products > .cardslider > div > section > a > figure{ margin-bottom:20px; }
#spot_index_products > .cardslider > div > section > a > p{ height:130px; }
@media screen and (max-width: 768px){
	#spot_index_products > h2{ background-image:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/article/index/bg_products_sp.png"); }
}

/* no+e */
#spot_index_note > .flex > section > a{
	color:rgb(0,0,0);
	transition:opacity .2s;
}
#spot_index_note > .flex > section > a.hover{ opacity:.7; }
#spot_index_note > .flex > section > a > h3{
	font-size:16px;
	font-weight:bold;
	margin:10px 0 5px;
	text-align:justify;
}

/* マジカルポンプ */
#spot_index_banners_magicalpump{ position:relative; }
#spot_index_banners_magicalpump > ul{
	display:flex;
	position:absolute;
	bottom:0;
	top:0;
	left:0;
	right:0;
}
#spot_index_banners_magicalpump > ul > li{
	flex-basis:50%;
	height:100%;
}
#spot_index_banners_magicalpump > ul > li > a{
	display:block;
	height:100%;
	background:white;
	opacity:0;
	transition:opacity .2s;
}
#spot_index_banners_magicalpump > ul > li > a:hover{ opacity:.2; }

/**
 * スポット：会社概要
----------------------------------------------------------------*/
/* 経営理念 */
#spot_company_philosophy > figure{ background:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/article/company/pvis.png") scroll no-repeat center center / cover; }
#spot_company_philosophy > ul{
	max-width:768px;
	margin:-120px auto 0;
}
@media screen and (max-width: 768px){
	#spot_company_philosophy > figure{ background-image:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/article/company/pvis_sp.png") }
	#spot_company_philosophy > ul{
		max-width:384px;
		margin-top:0;
	}
}

/* ご挨拶 */
#spot_company_greetings > .base > .flex > div{
	display:flex;
	flex-direction:column;
	justify-content:center;
}
#spot_company_greetings > .base > .flex > div > p.r{ margin-top:20px; }
@media screen and (max-width: 768px){
	#spot_company_greetings > .base > .flex > figure > img{ width:512px; }
}

/* 沿革 */
#spot_company_history > .base > header{
	display:flex;
	margin-top:40px;
}
#spot_company_history > .base > header > h3{
	width:50%;
	box-sizing:border-box;
	font-size:21px;
	color:rgb(32,64,154);
	line-height:50px;
	text-align:center;
}
#spot_company_history > .base > header > h3:first-child{ padding-right:40px; }
#spot_company_history > .base > header > h3:last-child{ padding-left:40px; }
#spot_company_history > .base > div{ padding:0 20px 50px; }
#spot_company_history > .base > div > section{
	display:flex;
	line-height:20px;
	position:relative;
}
#spot_company_history > .base > div > section > h4{
	background:rgb(32,64,154);
	color:white;
	order:2;
	padding:6px 10px;
	width:80px;
	box-sizing:border-box;
	font-size:18px;
	font-weight:bold;
	text-align:center;
	position:relative;
}
#spot_company_history > .base > div > section:first-child > h4::before,
#spot_company_history > .base > div > section:last-child > h4::after{
	content:'';
	display:block;
	background:rgb(32,64,154);
	width:80px;
	height:50px;
	position:absolute;
	left:0;
}
#spot_company_history > .base > div > section:first-child > h4::before{
	border-radius:50px 50px 0 0;
	bottom:100%;
}
#spot_company_history > .base > div > section:last-child > h4::after{
	border-radius:0 0 50px 50px;
	top:100%;
}
#spot_company_history > .base > div > section > ul{
	padding:6px 0;
	box-sizing:border-box;
	width:calc(50% - 40px);
}
#spot_company_history > .base > div > section > ul:first-of-type{
	order:1;
	text-align:right;
	padding-right:25px;
}
#spot_company_history > .base > div > section > ul:last-of-type{
	order:3;
	text-align:left;
	padding-left:25px;
}
#spot_company_history > .base > div > section > ul > li{
	font-size:12px;
	position:relative;
}
#spot_company_history > .base > div > section > ul > li:not(:first-child){ margin-top:10px; }
#spot_company_history > .base > div > section > ul > li::after{
	content:'';
	position:absolute;
	display:block;
	width:20px;
	border-top:1px solid #ccc;
	top:10px;
}
#spot_company_history > .base > div > section > ul:first-of-type > li::after{ right:-25px; }
#spot_company_history > .base > div > section > ul:last-of-type > li::after{ left:-25px; }
@media screen and (max-width: 1024px){
	#spot_company_history > .base > header{ display:none; }
	#spot_company_history > .base > div{ padding-top:50px; }
	#spot_company_history > .base > div > section{ display:block; }
	#spot_company_history > .base > div > section > h4{
		position:absolute;
		top:0;
		left:0;
		bottom:0;
	}
	#spot_company_history > .base > div > section > ul{
		width:auto;
		padding:0;
	}
	#spot_company_history > .base > div > section > ul:first-of-type{
		text-align:justify;
		padding-right:0;
		padding-left:105px;
	}
	#spot_company_history > .base > div > section > ul:last-of-type{
		padding-left:105px;
		text-align:justify;
	}
	#spot_company_history > .base > div > section > ul > li{ padding:6px 0; }
	#spot_company_history > .base > div > section > ul:first-of-type > li::after{
		right:auto;
		left:-25px;
		top:16px;
	}
}
@media screen and (max-width: 768px){
	#spot_company_history > .base > div > section:first-child > h4::before,
	#spot_company_history > .base > div > section:last-child > h4::after{
		width:60px;
		height:30px;
	}
	#spot_company_history > .base > div > section:first-child > h4::before{ border-radius:30px 30px 0 0; }
	#spot_company_history > .base > div > section:last-child > h4::after{ border-radius:0 0 30px 30px; }
	#spot_company_history > .base > div > section > h4{
		padding:6px;
		width:60px;
		font-size:16px;
	}
	#spot_company_history > .base > div > section > ul:first-of-type,
	#spot_company_history > .base > div > section > ul:last-of-type{ padding-left:85px; }
}

/**
 * スポット：代理店
----------------------------------------------------------------*/
/* ページビジュアル */
#spot_agency_pvis > h2{
	text-align:center;
	font-weight:bold;
	font-size:40px;
	padding:20px;
	margin-top:-130px;
}
@media screen and (max-width: 768px){
	#spot_agency_pvis > h2{
		font-size:6vw;
		margin-top:-20vw;
	}
}

/* 取扱商品ガイド */
.handlingguide{
	padding:10px;
	max-width:280px;
	margin:0 auto;
	box-sizing:border-box;
}
.handlingguide > figure{ display:flex; }
.handlingguide > figure:first-child{ margin-bottom:10px; }
.handlingguide > figure > img{
	width:40px;
	border-radius:3px;
	overflow:hidden;
}
.handlingguide > figure:first-child > img{ background:rgb(148,212,240); }
.handlingguide > figure:last-child > img{ background:rgb(199,225,143); }
.handlingguide > figure > figcaption{
	flex:1;
	line-height:40px;
	font-weight:bold;
	font-size:16px;
	padding-left:10px;
}

/* スタッフ */
#spot_agency_staffs > figure{ position:relative; }
#spot_agency_staffs > figure > figcaption{
	position:absolute;
	background:rgba(0,0,0,.8);
	color:white;
	bottom:0;
	left:0;
	padding:0 10px;
	font-size:14px;
}

/* スタッフリスト */
.stafflist{
	display:flex;
	justify-content:center;
	margin-bottom:40px;
}
.stafflist > figure{
	max-width:100px;
	margin:10px;
}
.stafflist > figure > figcaption{
	text-align:center;
	font-weight:bold;
}

/* エリアナビ */
#areanav > ul > li > a{
	border-radius:5px;
	overflow:hidden;
	display:block;
	transition:opacity .2s;
}
#areanav > ul > li > a.hover{ opacity:.7; }

/* 代理店 */
.agency{
	max-width:768px;
	border-bottom:1px solid #ccc;
	padding:10px 0;
	margin:0 auto;
	display:flex;
	position:relative;
}
.agency:first-child{ border-top:1px solid #ccc; }
.agency > figure{
	width:100px;
	margin-right:10px;
}
.agency > div{
	width:100%;
	flex:1;
}
.agency > div > h3{
	font-size:18px;
	font-weight:bold;
	margin-bottom:5px;
}
.agency > div > h3 > span{
	background:rgb(41,170,225);
	color:white;
	font-size:14px;
	padding:4px 8px;
	margin-right:5px;
}
.agency > footer{
	display:flex;
	width:220px;
}
.agency > footer > figure{
	margin-left:10px;
}
.agency > footer > figure > img{
	border-radius:10px;
	overflow:hidden;
}
.agency > footer > figure:first-child > img{ background:rgb(148,212,240); }
.agency > footer > figure:last-child > img{ background:rgb(199,225,143); }
@media screen and (max-width: 768px){
	.agency{
		margin:0 20px;
		min-height:140px;
	}
	.agency > figure{
		width:90px;
		margin:0;
		position:absolute;
		left:0;
		top:10px;
	}
	.agency > footer{
		width:90px;
		position:absolute;
		top:110px;
		left:0;
	}
	.agency > footer > figure{ width:40px; }
	.agency > footer > figure > img{ border-radius:3px; }
	.agency > footer > figure:first-child{ margin:0; }
	.agency > div{ padding-left:100px; }
}

/**
 * スポット：デモ機貸出について
----------------------------------------------------------------*/
#spot_demo_terms > .multicolumn > section:not(:first-child){ margin-top:40px; }

/**
 * スポット：商品ページ
----------------------------------------------------------------*/
#spec .big{ font-size:30px; font-weight:bold; }
#spec .mid{ font-size:20px; font-weight:bold; }
#spec .min{ font-size:14px; font-weight:normal; }
#spec .unit{ font-size:14px; font-weight:normal; }
#spec > section > div{ max-width:768px; }
#spec > section > div > section > h3{
	font-size:30px;
	font-weight:bold;
	text-align:center;
	padding:60px 20px 20px;
}
#spec > section > div > section > section{ padding:20px 0; }
#spec > section > div > section > section > h4{
	font-size:18px;
	font-weight:bold;
	box-sizing:border-box;
	padding:10px;
	text-decoration:underline;
}
@media screen and (max-width: 768px){
	#spec .big{ font-size:20px; }
	#spec .mid{ font-size:14px; }
	#spec .min{ font-size:12px; }
	#spec .unit{ font-size:12px; }
	#spec > section > div > section > h3{ font-size:24px; }
	#spec > section > div > section > section > h4{ font-size:14px; }
}

/* 脚注 */
#spec .note{padding-top:10px; }
#spec .bg_blackblue .note{ background:rgba(255,255,255,.1); }

/* グリッド */
.spec_grid{ display:flex; }
.spec_grid > h4{ width:140px; }
.spec_grid > ul{
	width:calc(100% - 140px);
	display:flex;
}
.spec_grid > ul > li{
	box-sizing:border-box;
	padding:10px;
	text-align:center;
}
#spec[data-n="1"] .spec_grid > ul > li{ width:calc(100% / 1); }
#spec[data-n="2"] .spec_grid > ul > li{ width:calc(100% / 2); }
#spec[data-n="3"] .spec_grid > ul > li{ width:calc(100% / 3); }
#spec[data-n="4"] .spec_grid > ul > li{ width:calc(100% / 4); }
#spec[data-n="5"] .spec_grid > ul > li{ width:calc(100% / 5); }
@media screen and (max-width: 768px){
	.spec_grid > h4{ width:100px; }
	.spec_grid > ul{ width:calc(100% - 100px); }
}

/* 棒グラフ */
.spec_bars > ul > li{ display:flex; }
.spec_bars > ul > li > h5{
	width:140px;
	padding:10px;
	box-sizing:border-box;
}
.spec_bars > ul > li > div{
	width:calc(100% - 140px);
	padding:10px;
	box-sizing:border-box;
}
.spec_bars > ul > li > div > .bar{
	height:16px;
	border-radius:8px;
	background:rgb(169,221,243);
	position:relative;
	border-right:20px solid rgba(0,0,0,0);
	border-left:20px solid rgba(0,0,0,0);
	box-sizing:border-box;
}
.spec_bars > ul > li > div > .bar > span{
	height:100%;
	border-radius:8px;
	background:rgb(41,170,225);
	position:absolute;
}
.spec_bars.scrollable > ul > li > div > .bar{
	width:0;
	transition:width 1s;
}
.spec_bars.scrollable.scrolled > ul > li > div > .bar{ width:100%; }
@media screen and (max-width: 768px){
	.spec_bars > ul > li > h5{ width:100px; }
	.spec_bars > ul > li > div{ width:calc(100% - 100px); }
}

/* 基本情報テーブル */
.basic_table{
	width:100%;
	border-top:1px solid rgba(0,0,0,.3);
}
.basic_table th{ width:70px; }
.basic_table th,
.basic_table td{
	padding:10px;
	border-bottom:1px solid rgba(0,0,0,.3);
}
@media screen and (max-width: 768px){
	.basic_table th[rowspan]{
		width:1em;
		background:rgba(0,0,0,.1);
	}
}

/* テーブル */
.spec_table > table{
	width:100%;
	table-layout:fixed;
}
.spec_table > table th,
.spec_table > table td{
	padding:10px;
	border-bottom:1px solid rgba(0,0,0,.3);
}
.spec_table.separate > table > thead > tr > th:not(:last-child),
.spec_table.separate > table > tbody > tr > th,
.spec_table.separate > table > tbody > tr > td:not(:last-child){ border-right:1px solid rgba(0,0,0,.3); }
.spec_table.white > table th,
.spec_table.white > table td,
.spec_table.white.separate > table > thead > tr > th:not(:last-child),
.spec_table.white.separate > table > tbody > tr > th,
.spec_table.white.separate > table > tbody > tr > td:not(:last-child){ border-color:rgba(255,255,255,.3); }
.spec_table > table > * > tr > th:first-child{
	width:140px;
	box-sizing:border-box;
}
.spec_table > table > tbody > tr > th{ font-weight:normal; }
.spec_table > table > thead > tr > th,
.spec_table > table > tbody > tr > td{ text-align:center; }
@media screen and (max-width: 768px){
	.spec_table > table > * > tr > th:first-child{ width:100px; }
}

/* タブ */
.tab{ padding:20px; }
.tab > ul{ display:flex; }
.tab > ul > li{ display:inline-block; }
.tab > ul > li > a{
	display:inline-block;
	border:2px solid rgb(32,64,154);
	border-bottom:0;
	border-radius:8px 8px 0 0;
	color:rgb(32,64,154);
	font-weight:bold;
	padding:10px 20px;
	font-size:18px;
	margin-right:-2px;
	background:white;
	transition:background .2s;
}
.tab > ul > li > a.hover{ background:rgb(210,216,234); }
.tab > ul > li.active > a{
	background:rgb(32,64,154);
	color:white;
}
.tab > ul > li.active > a.hover{ background:rgb(54,83,164); }
.tab > section{
	display:none;
	background:white;
	padding:20px;
	border:4px solid rgb(32,64,154);
}
.tab > section.active{ display:block; }
.tab > section > h3{
	font-size:20px;
	font-weight:bold;
}
.tab > section > section > h4{
	font-size:16px;
	background:rgb(32,64,154);
	color:white;
	padding:4px 10px;
	margin:10px 0;
}
.tab > section > section > h4::before{ content:'●'; }
@media screen and (max-width: 768px){
	.tab > ul > li > a{
		font-size:14px;
		padding:4px 6px;
		border-radius:5px 5px 0 0;
	}
	.tab > section{
		padding:10px;
		border-width:2px;
	}
	.tab > section > h3{ font-size:16px; }
	.tab > section > section > h4{
		font-size:14px;
		padding:4px;
	}
}

/* お問い合わせ */
#catalog > .flex{
	max-width:768px;
	margin:0 auto;
}
#catalog > .flex > section > h3{
	font-size:20px;
	text-align:center;
	background:rgb(32,64,154);
	color:white;
	margin:0 15px 10px;
	position:relative;
	padding:4px 10px;
}
#catalog > .flex > section > h3::before,
#catalog > .flex > section > h3::after{
	content:'';
	display:block;
	position:absolute;
	top:0;
	bottom:0;
	background:rgb(32,64,154);
	width:10px;
}
#catalog > .flex > section > h3::before{ left:-15px; }
#catalog > .flex > section > h3::after{ right:-15px; }
@media screen and (max-width: 768px){
	#catalog > .flex > section > h3{ font-size:18px; }
	#catalog > .flex{ max-width:512px; }
}

/**
 * よくあるご質問
----------------------------------------------------------------*/
#spot_faq_contents > li > a{ text-decoration:underline; }
#spot_faq_contents > li > a > span{ color:crimson; }
#spot_faq_contents > li > footer{
	overflow-y:hidden;
	max-height:0;
	margin:0;
	transition:max-height 1s, margin .2s;
}
#spot_faq_contents > li.active > footer{
	max-height:2000px;
	margin:20px 0 60px;
}
#spot_faq_contents > li > footer > h3{
	background:rgb(32,64,154);
	color:white;
	font-size:20px;
	font-weight:bold;
	padding:10px 20px;
	border-radius:20px 20px 0 0;
}
#spot_faq_contents > li > footer > h3::before{ content:'A.'; }
#spot_faq_contents > li > footer > div{
	font-weight:normal;
	background:white;
	padding:40px 20px;
	border-radius:0 0 20px 20px;
}
#spot_faq_contents > li > footer > div .note:last-child{ margin-bottom:0; }
#spot_faq_contents > li > footer > div figure{ margin:20px 0; }

/**
 * 採用情報
----------------------------------------------------------------*/
#spot_recruit_leadvis{
	background:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/article/recruit/bg_leadvis.png") no-repeat left center / contain;
}
#spot_recruit_about > .base > section:first-of-type > figure{ margin-top:-60px; }
@media screen and (max-width: 768px){
	#spot_recruit_about > .base > section:first-of-type > figure{ margin-top:0; }
}

/**
 * RNADX LP
----------------------------------------------------------------*/
#lp_randx{
	color:rgb(62,58,57);
	position:relative;
	background:white;
}
#lp_randx > section{
	position:relative;
	z-index:0;
	overflow:hidden;
}

/* 斜め背景 */
.skew{
	position:absolute;
	z-index:-1;
}

/* 大見出し */
.randx_h2{
	font-size:45px;
	text-align:center;
	position:relative;
	z-index:1;
	line-height:1.4;
	padding:60px 20px 40px;
}
.randx_h2 > h2{
	font-weight:bold;
	letter-spacing:.1em;
}
.randx_h2 > p{
	font-size:20px;
	text-align:center;
	font-weight:bold;
	color:rgb(46,157,208);
}
.randx_h2::before{
	--w:600px;
	content:'';
	border-radius:0 0 var(--w) var(--w);
	background:white;
	width:var(--w);
	height:calc(var(--w) / 2);
	top:calc(var(--w) / 2 * -1);
	top:0;
	display:block;
	position:absolute;
	left:0;
	right:0;
	margin:0 auto;
	z-index:-1;
}
.randx_h2.water::before{ background:rgb(234,245,250); }
.randx_h2_simple{
	font-size:45px;
	text-align:center;
	line-height:1.4;
	padding:60px 20px 40px;
}
.randx_h2_simple > h2{
	font-weight:bold;
	letter-spacing:.1em;
}
.randx_h2_simple > p{
	font-size:20px;
	text-align:center;
	font-weight:bold;
	color:rgb(46,157,208);
}
.randx_h2_simple.white{ color:white; }
.randx_h2_simple.white > p{ color:white; }
@media screen and (max-width: 768px){
	.randx_h2{
		font-size:6.5vw;
		padding:9vw 20px 6vw;
	}
	.randx_h2_simple{ font-size:6.5vw; }
	.randx_h2 > p,
	.randx_h2_simple > p{ font-size:3.5vw; }
	.randx_h2::before{ --w:70vw; }
}

/* 座布団 */
.randx_zabuton{
	background:rgb(46,157,208);
	display:inline-block;
	padding:2px 10px;
	color:white;
	font-weight:bold;
	font-size:150%;
}

/* 大きい文字 */
.randx_big{
	font-size:45px;
	line-height:1.4;
	padding:40px 20px 20px;
}
.randx_big > *{
	font-size:60px;
	text-align:center;
	font-weight:bold;
}
.randx_big > p{
	font-size:40px;
	font-weight:normal;
	margin:10px 0;
}
.randx_mid{
	font-size:20px;
	font-weight:bold;
	color:rgb(32,64,154);
}
@media screen and (max-width: 768px){
	.randx_big > *{ font-size:7vw; }
	.randx_big > p{ font-size:4vw; }
	.randx_mid{ font-size:16px; }
}

/* スワイプナビ */
.swipable{ position:relative; }
.swipable::after{
	content:'';
	display:block;
	position:absolute;
	top:calc(50% - 300px / 2);
	left:calc(50% - 200px / 2);
	width:300px;
	height:200px;
	box-sizing:border-box;
	background:rgba(0,0,0,.1) url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/article/iot/randx/scrollnav.png") scroll no-repeat center center / cover;
	opacity:0;
	transition:opacity .7s;
}
.swipable.active::after{ opacity:1; }

/* RANDXメインビジュアル */
#randx_mvis h2 > p{
	background:rgb(46,157,208);
	color:white;
	font-weight:bold;
	font-size:40px;
	display:inline-block;
	margin:5px 0;
	padding:0 10px;
}
#randx_mvis_bg1{
	top:0;
	--r:calc((100vw - 1200px) / 2);
	--w:calc(100vw - var(--r));
	right:var(--r);
	width:var(--w);
	height:var(--w);
	transform:skewY(-45deg);
	transform-origin:left top;
	background:linear-gradient(
		0deg,
		rgb(46,157,208) 50%,
		rgb(32,64,154) 100%
	);
}
#randx_mvis_bg2{
	top:0;
	left:0;
	right:0;
	bottom:0;
	background:repeating-radial-gradient(
		circle at 35vw 200px,
		transparent 0px,
		transparent 10px,
		rgb(150,206,231) 10px,
		rgb(150,206,231) 12px);
	opacity:.2;
}
#randx_mvis_bg3{
	top:0;
	left:50vw;
	width:50vw;
	height:50vw;
	transform:skewY(45deg);
	transform-origin:right top;
	overflow:hidden;
}
#randx_mvis_bg3::before{
	display:block;
	content:'';
	position:absolute;
	top:50%;
	left:0;
	right:0;
	bottom:0;
	background:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/article/iot/randx/mvis_bg.png") scroll no-repeat center center / cover;
	transform:skewY(-45deg);
	width:50vw;
	height:50vw;
}
#randx_mvis_bg4{
	bottom:0;
	left:30vw;
	width:70vw;
	height:70vw;
	transform:skewY(-45deg);
	transform-origin:right bottom;
	background:rgb(192,225,240);
}
@media screen and (max-width: 1200px){
	#randx_mvis_bg1{
		--r:0;
		--w:100vw;
	}
}
@media screen and (max-width: 768px){
	#randx_mvis h2 > p{ font-size:6vw; }
	#randx_mvis_bg1{ top:25vw; }
}

/* RANDXの特徴 */
#randx_feature{
	background:linear-gradient(
		90deg,
		rgb(46,157,208) 50%,
		rgb(32,64,154) 100%
	);
}
#randx_feature_bg1{
	top:0;
	left:0;
	width:100vw;
	height:100vw;
	transform:skewY(-45deg);
	transform-origin:left top;
	background:rgb(234,245,250);
}
#randx_feature_bg2{
	top:0;
	left:0;
	width:30vw;
	height:30vw;
	transform:skewY(-45deg);
	transform-origin:left top;
	overflow:hidden;
}
#randx_feature_bg2::before{
	display:block;
	content:'';
	position:absolute;
	top:50%;
	left:0;
	right:0;
	bottom:0;
	background:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/article/iot/randx/features_bg1.png") scroll no-repeat center center / cover;
	transform:skewY(45deg);
	width:30vw;
	height:30vw;
}
#randx_feature_bg3{
	bottom:-40vw;
	right:0;
	width:40vw;
	height:40vw;
	transform:skewY(-45deg);
	transform-origin:left bottom;
	overflow:hidden;
}
#randx_feature_bg3::before{
	display:block;
	content:'';
	position:absolute;
	top:-50%;
	left:0;
	right:0;
	bottom:0;
	background:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/article/iot/randx/features_bg2.png") scroll no-repeat center center / cover;
	transform:skewY(45deg);
	width:40vw;
	height:40vw;
}
#randx_feature > .base h2{ text-align:right; }
#randx_feature > .base h2 > img{
	display:inline-block;
	margin:0;
}
#randx_feature > .base section{ position:relative; }
#randx_feature > .base section header > p{
	position:absolute;
	top:0;
	left:-2em;
	transform:rotate(90deg);
	transform-origin:left bottom;
	font-family:Arial Black, sans-serif;
	font-size:30px;
}
#randx_feature > .base section h3{
	font-size:24px;
	font-weight:bold;
	margin:20px 0;
}
#randx_feature > .base section.sec1{ margin-top:-100px; }
#randx_feature > .base section.sec1 h3{ color:rgb(46,157,208); }
#randx_feature > .base section.sec1 header > img{
	position:absolute;
	top:-100px;
	left:0;
}
#randx_feature > .base section.sec1 header > p{ color:rgb(46,157,208); }
#randx_feature > .base section.sec2{
	padding-top:80px;
	color:white;
}
#randx_feature > .base section.sec2 header > img{ margin:-20px 0 -40px auto; }
#randx_feature > .base section.sec2 header > p{
	color:white;
	left:auto;
	top:150px;
	right:0;
	transform-origin:right bottom;
}
#randx_feature > .base section.sec2 h3{ text-align:right; }
#randx_feature > .base section.sec3 > .flex > figure{ margin-top:-300px; }
#randx_feature > .base section.sec3 > :not(.flex){ display:flex; }
#randx_feature > .base section.sec3 > :not(.flex) > header{
	width:200px;
	padding-right:20px;
}
#randx_feature > .base section.sec3 > :not(.flex) > div{ width:400px; }
@media screen and (max-width: 768px){
	#randx_feature > .base h2 > img{ width:60vw; }
	#randx_feature > .base section{ padding-left:60px; }
	#randx_feature > .base section header > p{ left:0; }
	#randx_feature > .base section header > img{ width:30vw; }
	#randx_feature > .base section h3{
		font-size:5vw;
		margin:2vw 0;
	}
	#randx_feature > .base section.sec1{
		margin-top:20px;
		color:white;
	}
	#randx_feature > .base section.sec1 h3{ color:white; }
	#randx_feature > .base section.sec1 header > p{
		top:-60px;
		text-shadow:
			2px 2px 0 rgb(234,245,250),
			-2px 2px 0 rgb(234,245,250),
			2px -2px 0 rgb(234,245,250),
			-2px -2px 0 rgb(234,245,250);
	}
	#randx_feature > .base section.sec2{ padding:20px 60px 20px 0; }
	#randx_feature > .base section.sec2 header > p{
		top:55vw;
		right:40px;
	}
	#randx_feature > .base section.sec2 header > img{
		position:absolute;
		top:0;
		right:-10vw;
	}
	#randx_feature > .base section.sec2 h3{ text-align:left; }
	#randx_feature > .base section.sec2 figure > img{ margin-left:-20px; }
	#randx_feature > .base section.sec3{
		padding-bottom:20vw;
		padding-right:20px;
	}
	#randx_feature > .base section.sec3 > .flex > figure{
		margin-top:0;
		margin-left:20vw;
		width:70vw;
	}
	#randx_feature > .base section.sec3 > :not(.flex){
		display:block;
		color:white;
	}
	#randx_feature > .base section.sec3 > :not(.flex) > header{
		width:auto;
		padding:0;
	}
	#randx_feature > .base section.sec3 > :not(.flex) > header > img{
		position:absolute;
		top:0;
	}
	#randx_feature > .base section.sec3 > :not(.flex) > div{ width:auto; }
}

/* よくある課題 */
#randx_problems > header{
	background:rgb(235,235,235);
	position:relative;
}
#randx_problems > header::after{
	--h:100px;
	content:'';
	position:absolute;
	display:block;
	width:calc(var(--h) * 1.15);
	height:var(--h);
	background:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/article/iot/randx/problems_fukidashi.png") scroll no-repeat center center / cover;
	bottom:calc(var(--h) * -1);
	right:50%;
	margin-right:-400px;
}
#randx_problems > header > img{
	position:relative;
	z-index:1;
}
#randx_problems > section{
	background:rgb(46,157,208);
	color:white;
}
#randx_problems > footer > h3{
	text-align:center;
	background:rgb(32,64,154);
	color:white;
	font-weight:bold;
	font-size:60px;
	padding:10px 20px;
	position:relative;
	letter-spacing:.1em;
}
#randx_problems > footer > h3 > img{
	position:absolute;
	top:0;
	bottom:0;
	margin:auto;
	right:0;
}
#randx_problems > footer > div > .flex > h3{
	font-size:50px;
	color:rgb(46,157,208);
	vertical-align:middle;
	font-weight:bold;
	letter-spacing:.1em;
	padding:80px 20px;
}
#randx_problems > footer > div > .flex > h3 > img{
	display:inline-block;
	margin:0;
	vertical-align:middle;
}
#randx_problems > footer > div > .flex > .flex > figure{
	background:rgb(46,157,208);
	border-radius:20px;
}
@media screen and (max-width: 1200px){
	#randx_problems > header::after{
		--h:8vw;
		margin-right:-30vw;
	}
	#randx_problems > footer > h3{
		font-size:5vw;
	}
	#randx_problems > footer > h3 > img{
		width:25vw;
	}
	#randx_problems > footer > div > .flex > h3{
		font-size:8vw;
		text-align:center;
		padding:20px;
	}
	#randx_problems > footer > div > .flex > h3 > img{
		display:block;
		margin:0 auto;
	}
}

/* 導入のメリット */
#randx_merits{ background:rgb(171,215,236); }
#randx_merits > header > img{
	position:relative;
	z-index:1;
}
#randx_merits > div{
	background:rgb(46,157,208);
	background:linear-gradient(
		180deg,
		rgb(46,157,208) 50%,
		rgb(32,64,154) 100%
	);
	padding:40px 0 160px;
}
#randx_merits > div section{
	background:white;
	border-radius:30px;
	padding:20px;
}
#randx_merits > div section > header > h3{
	text-align:center;
	font-size:30px;
	font-weight:bold;
	padding-bottom:20px;
	letter-spacing:.1em;
}
#randx_merits > div section > div > h4{
	font-size:20px;
	font-weight:bold;
	padding-top:20px;
}
#randx_merits > div section > div > .randx_example{
	font-size:14px;
	color:rgb(46,157,208);
}
#randx_merits > div > .base > .flex.--1 > section{ margin-top:-10px; }
@media screen and (max-width: 768px){
	#randx_merits > div section > header > h3{ font-size:6vw; }
	#randx_merits > div section > header > img{ width:30vw; }
}

/* ラインナップ */
#randx_lineup{
	z-index:1 !important;
	overflow:visible !important;
}
#randx_lineup > header{
	position:absolute;
	left:0;
	right:0;
	top:-160px;
	z-index:10;
}
#randx_lineup_bg{
	height:26.041666666vw;
	overflow:hidden;
	position:absolute;
	z-index:5;
	top:0;
	left:0;
	width:100%;
}
#randx_lineup_bg::before{
	content:'';
	display:block;
	position:relative;
	top:0;
	left:0;
	width:100%;
	height:26.041666666vw;
	transform:skewY(-14.596575525494deg);
	transform-origin:left top;
	background:rgb(32,64,154);
}
#randx_lineup > .flex{
	background:repeating-radial-gradient(
		circle at 50vw 200px,
		transparent 0px,
		transparent 10px,
		rgba(150,206,231,0.1) 10px,
		rgba(150,206,231,0.1) 12px);
}
#randx_lineup > .flex > section:first-child{ background:rgba(46,157,208,0.2); }
#randx_lineup > .flex > section:last-child{ background:rgba(62,58,57,0.1); }
#randx_lineup > .flex > section > div{
	max-width:560px;
	margin:auto;
	position:relative;
	padding-bottom:40px;
}
#randx_lineup > .flex > section:first-child > div{ margin-right:0; }
#randx_lineup > .flex > section:last-child > div{ margin-left:0; }
#randx_lineup > .flex > section > div > .layer1{
	position:absolute;
	z-index:10;
}
#randx_lineup > .flex > section > div > table{ margin:40px 20px; }
#randx_lineup > .flex > section > div > table th{
	width:90px;
	vertical-align:top;
	padding:4px 20px 4px 0;
}
@media screen and (max-width: 768px){
	#randx_lineup > .flex > section > div{ max-width:none; }
	#randx_lineup > .flex > section > div > img{
		max-width:none;
		width:100%;
	}
	#randx_lineup > .flex > section > div > .layer1{
		left:0;
		right:0;
	}
}

/* サービス概要 */
#randx_services > .base > .flex.--2 > section{
	padding:20px;
	border-radius:30px;
}
#randx_services > .base > .flex.--2 > section:first-child{
	background:rgb(234,245,250);
	color:rgb(46,157,208);
	border-color:rgb(46,157,208);
}
#randx_services > .base > .flex.--2 > section:last-child{
	background:rgb(232,235,244);
	color:rgb(32,64,154);
	border-color:rgb(32,64,154);
}
#randx_services > .base > .flex.--2 > section > header > div > h3{
	border-bottom-width:4px;
	border-bottom-style:solid;
	text-align:center;
	font-size:40px;
	padding:10px 0;
	margin-bottom:10px;
}
#randx_services > .base > .flex.--2 > section > header > div > p{
	text-align:center;
	font-size:20px;
	margin-bottom:20px;
	font-weight:bold;
}
@media screen and (max-width: 768px){
	#randx_services > .base > .flex.--2 > section > header{
		display:flex;
		align-items:center;
		gap:10px;
	}
	#randx_services > .base > .flex.--2 > section > header > figure{ width:100px; }
	#randx_services > .base > .flex.--2 > section > header > div{ width:calc(100% - 100px - 10px); }
	#randx_services > .base > .flex.--2 > section > header > div > h3{
		font-size:30px;
		padding:0;
	}
	#randx_services > .base > .flex.--2 > section > header > div > p{ font-size:18px; }
}

/* 5つの価値 */
#randx_values{ background:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/article/iot/randx/values_bg.png") scroll repeat center center; }
#randx_values > .base > div{
	margin:20px;
	padding:40px 20px;
	background:white;
}
#randx_values > .base > div section > header{
	color:rgb(46,157,208);
	text-align:center;
	padding:20px 0;
}
#randx_values > .base > div section > header > h3{
	font-size:24px;
	font-weight:bold;
}
#randx_values > .base > div section > header > p{ text-align:center; }
#randx_values > .base > div section > figure{ position:relative; }
#randx_values > .base > div > .flex.--2 > section > figure::before{
	--h:80px;
	content:'';
	display:block;
	width:calc(var(--h) * 1.12);
	height:var(--h);
	position:absolute;
	top:calc(var(--h) / 2 * -1);
	left:calc(var(--h) / 5);
}
#randx_values > .base > div > .flex.--2 > section:first-child > figure::before{ background:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/article/iot/randx/values_icon1.png") scroll no-repeat center center / cover; }
#randx_values > .base > div > .flex.--2 > section:last-child > figure::before{ background:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/article/iot/randx/values_icon2.png") scroll no-repeat center center / cover; }
#randx_values .illust{ position:relative; }
#randx_values .illust > img{
	position:absolute;
	display:inline-block;
	width:60%;
}
#randx_values .illust > :nth-child(1){
	top:0;
	left:-450px;
}
#randx_values .illust > :nth-child(2){
	top:-250px;
	right:-450px;
}
#randx_values .illust > :nth-child(3){
	top:520px;
	left:-510px;
}
#randx_values .illust > :nth-child(4){
	top:450px;
	right:-500px;
}
@media screen and (max-width: 1200px){
	#randx_values .illust > :nth-child(2){
		top:-350px;
		right:-250px;
	}
}
@media screen and (max-width: 768px){
	#randx_values .illust{ display:none; }
	#randx_values > .base > div{ padding:20px 0; }
	#randx_values > .base > div > .flex.--2 > section:last-child{ margin-top:60px; }
	#randx_values > .base > div > .flex.--2 > section > figure::before{ --h:15vw; }
}

/* 他社製品との違い */
#randx_differences{ background:rgb(234,245,250); }
#randx_differences_bg1{
	top:0;
	--r:calc((100vw - 1200px) / 2);
	--w:calc(100vw - var(--r));
	right:var(--r);
	width:var(--w);
	height:var(--w);
	transform:skewY(-45deg);
	transform-origin:left top;
	background:linear-gradient(
		0deg,
		rgb(46,157,208) 50%,
		rgb(32,64,154) 100%
	);
	overflow:hidden;
}
#randx_differences_bg1::before{
	content:'';
	display:block;
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	width:100vw;
	height:100vw;
	transform-origin:left top;
	background:repeating-radial-gradient(
		circle at 35vw 300px,
		transparent 0px,
		transparent 10px,
		rgb(150,206,231) 10px,
		rgb(150,206,231) 12px);
	opacity:.2;
	transform:skewY(45deg);
}
#randx_differences_bg1::after{
	content:'';
	display:block;
	position:absolute;
	left:0;
	bottom:0;
	transform-origin:left bottom;
	transform:skewY(45deg);
	background:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/article/iot/randx/differences_illust_human1.png") scroll no-repeat center center / cover;
	--w:460px;
	width:var(--w);
	height:calc(var(--w) * 760 / 460);
}
#randx_differences_bg2{
	top:0;
	left:70vw;
	width:30vw;
	height:30vw;
	transform:skewY(45deg);
	transform-origin:right top;
	overflow:hidden;
}
#randx_differences_bg2::before{
	display:block;
	content:'';
	position:absolute;
	top:50%;
	left:0;
	right:0;
	bottom:0;
	background:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/article/iot/randx/differences_bg1.png") scroll no-repeat center center / cover;
	transform:skewY(-45deg);
	width:30vw;
	height:30vw;
}
#randx_differences_bg3{
	bottom:0;
	left:30vw;
	width:70vw;
	height:70vw;
	transform:skewY(-45deg);
	transform-origin:right bottom;
	background:linear-gradient(
		180deg,
		rgb(46,157,208) 50%,
		rgb(32,64,154) 100%
	);
	overflow:hidden;
}
#randx_differences_bg3::before{
	content:'';
	display:block;
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	width:100vw;
	height:100vw;
	transform-origin:right bottom;
	background:repeating-radial-gradient(
		circle at 50vw 90vw,
		transparent 0px,
		transparent 10px,
		rgb(150,206,231) 10px,
		rgb(150,206,231) 12px);
	opacity:.2;
	transform:skewY(45deg);
}
#randx_differences_bg4{
	bottom:0;
	left:0;
	width:30vw;
	height:30vw;
	transform:skewY(45deg);
	transform-origin:left bottom;
	overflow:hidden;
}
#randx_differences_bg4::before{
	display:block;
	content:'';
	position:absolute;
	top:-50%;
	left:0;
	right:0;
	bottom:0;
	background:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/article/iot/randx/differences_bg2.png") scroll no-repeat center center / cover;
	transform:skewY(-45deg);
	width:30vw;
	height:30vw;
}
#randx_differences > .base > div{
	background:white;
	margin:0 20px;
}
#randx_differences_contents > div{
	overflow-x:scroll;
	width:100%;
}
#randx_differences_contents > div > div{
	display:flex;
	width:100%;
	min-width:calc(308px * 3 + 20px);
	gap:10px;
}
#randx_differences_contents > div > div > section > figure > p{
	height:83.23px;
	text-align:center;
	font-weight:bold;
	font-size:24px;
	display:flex;
	flex-wrap:wrap;
	flex-direction:column;
	justify-content:center;
	line-height:1.3;
	overflow:hidden;
}
#randx_differences_contents > div > div > section > figure > p::after{
	content:'▼';
	transform:scale(2, 1);
	font-size:60%;
}
#randx_differences_contents > div > div > section > div{
	width:308px;
	background:rgb(235,235,235);
	height:calc(100% - 83.23px - 20px);
}
#randx_differences_contents > div > div > section:first-child > div{ background:rgb(234,245,250); }
#randx_differences_contents > div > div > section > div > h3{
	background:rgb(62,58,57);
	color:white;
	font-size:24px;
	padding:20px;
	font-weight:bold;
	text-align:center;
	position:relative;
}
#randx_differences_contents > div > div > section:first-child > div > h3{ background:rgb(46,157,208); }
#randx_differences_contents > div > div > section > div > h3::after{
	content:'';
	display:block;
	position:absolute;
	top:78px;
	left:0;
	right:0;
	margin:0 auto;
	border-left:15px solid transparent;
	border-right:15px solid transparent;
	border-top:15px solid rgb(62,58,57);
	border-bottom:15px solid transparent;
	width:0;
	height:0;
}
#randx_differences_contents > div > div > section:first-child > div > h3::after{ border-top-color:rgb(46,157,208); }
#randx_differences_contents > div > div > section > div > section{ padding:20px; }
#randx_differences_contents > div > div > section > div > section:first-of-type{ margin-top:40px; }
#randx_differences_contents > div > div > section > div > section:last-of-type{ margin-bottom:20px; }
#randx_differences_contents > div > div > section > div > section > h4{
	background:rgb(119,117,116);
	color:white;
	padding:0 20px;
	text-align:center;
	font-weight:bold;
	letter-spacing:.1em;
	font-size:18px;
}
#randx_differences_contents > div > div > section:first-child > div > section > h4{ background:rgb(108,186,222); }
#randx_differences_contents > div > div > section:first-child > div > section > ul{ color:rgb(46,157,208); }
#randx_differences_contents > div > div > section > div > section > ul{ padding:20px 0; }
#randx_differences_contents > div > div > section > div > section > ul > li{
	position:relative;
	padding:3px 0 3px 16px;
}
#randx_differences_contents > div > div > section > div > section > ul > li::before{
	content:'●';
	position:absolute;
	top:3px;
	left:0;
}

@media screen and (max-width: 2120px){
	#randx_differences_bg1::after{ --w:calc((100vw - 1024px) / 2); }
}
@media screen and (max-width: 1920px){
	#randx_differences_bg1::after{
		--w:400px;
		left:-100px;
	}
}
@media screen and (max-width: 1200px){
	#randx_differences_bg1{
		--r:0;
		--w:100vw;
	}
	#randx_differences_bg1::after{ display:none; }
}
@media screen and (max-width: 768px){
	#randx_differences_contents > div > div{ min-width:calc(240px * 3 + 20px); }
	#randx_differences_contents > div > div > section > figure > img{ width:240px; }
	#randx_differences_contents > div > div > section > div{
		width:240px;
		height:calc(100% - 64.84px - 20px);
	}
	#randx_differences_contents > div > div > section > figure > p{ height:64.84px; }
	#randx_differences_contents > div > div > section > div > section{
		font-size:13px;
		padding:0 20px;
	}
	#randx_differences_contents > div > div > section:last-child{ border-right:20px solid white; }
	#randx_differences_contents > div > div > section > div > section > ul > li{ padding:1px 0 1px 16px; }
}

/* ご利用シーン */
#randx_scenes{
	background:rgb(5,171,251) url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/article/iot/randx/scenes_bg.png") scroll no-repeat center bottom / 100%;
	min-height:2000px;
	position:relative;
}
#randx_scenes_bg{
	top:0;
	left:0;
	right:0;
	bottom:0;
	position:absolute;
	background:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/article/iot/randx/scenes_bg_randx.png") scroll no-repeat center top / 100%;
	mix-blend-mode: multiply;
	opacity:.2;
	z-index:-1;
}
#randx_scenes > .base > .flex > section{
	background:white;
	border-radius:20px;
}
#randx_scenes > .base > .flex > section > div{ padding:20px; }
#randx_scenes > .base > .flex > section > div > header > img{}
#randx_scenes > .base > .flex > section > div > header > h3{
	font-size:30px;
	font-weight:bold;
	text-align:center;
	position:relative;
	padding-bottom:10px;
}
#randx_scenes > .base > .flex > section > div > header > h3::before{
	content:'';
	display:block;
	position:absolute;
	bottom:0;
	left:0;
	right:0;
	height:4px;
	background:linear-gradient(
		90deg,
		rgb(46,157,208) calc(100% / 7 * 1), rgb(62,58,57) calc(100% / 7 * 1),
		rgb(62,58,57) calc(100% / 7 * 2), rgb(46,157,208) calc(100% / 7 * 2),
		rgb(46,157,208) calc(100% / 7 * 3), rgb(62,58,57) calc(100% / 7 * 3),
		rgb(62,58,57) calc(100% / 7 * 4), rgb(46,157,208) calc(100% / 7 * 4),
		rgb(46,157,208) calc(100% / 7 * 5), rgb(62,58,57) calc(100% / 7 * 5),
		rgb(62,58,57) calc(100% / 7 * 6), rgb(46,157,208) calc(100% / 7 * 6),
		rgb(46,157,208)	);
}
#randx_scenes > .base > .flex > section > div > header > p{
	font-family:Arial Black, sans-serif;
	color:rgb(46,157,208);
	text-align:center;
	padding:10px 0;
}
#randx_scenes > .base > .flex > section > div > p{ padding-top:20px; }

/* ご提供プラン */
.randx_pricetable{ box-sizing:border-box; }
.randx_pricetable tr > *{
	padding:10px;
	text-align:center;
}
.randx_pricetable thead > tr > th:not([colspan]),
.randx_pricetable tbody > tr > td{
	font-size:30px;
	width:256px;
	position:relative;
}
.randx_pricetable tbody > tr > td > .kome{
	font-size:14px;
	position:absolute;
	bottom:10px;
	right:10px;
	text-align:right;
}
.randx_pricetable thead > tr > th{
	color:white;
	font-size:24px;
	line-height:1;
	padding:20px 10px;
}
.randx_pricetable thead > tr > th > small{
	font-size:16px;
	font-weight:normal;
}
.randx_pricetable thead > tr > th:not(:first-of-type){ border-left:1px solid white; }
.randx_pricetable thead > tr > th:nth-child(2){ background:rgb(242,192,76); }
.randx_pricetable thead > tr > th:nth-child(3){ background:rgb(102,202,143); }
.randx_pricetable thead > tr > th:nth-child(4){ background:rgb(121,140,194); }
.randx_pricetable tbody > tr > th{
	font-size:18px;
	line-height:1.3;
	font-weight:normal;
	background:rgb(235,235,235);
}
.randx_pricetable tbody > tr:not(:first-child) > th{ border-top:1px solid white; }
.randx_pricetable tbody > tr > th[rowspan]{
	border-right:1px solid white;
	background:rgb(197,195,195);
	width:80px;
}
.randx_pricetable tbody > tr > th[colspan]{ width:200px; }
.randx_pricetable tbody > tr > th:not([colspan]):not([rowspan]){ width:120px; }
.randx_pricetable tbody > tr > td:not(:first-child){ border-top:1px solid #ccc; }
.randx_pricetable tbody > tr > td:not(:first-of-type){ border-left:1px solid #ccc; }
.footnotelist{ counter-reset:footnotes; }
.footnotelist > li{
	counter-increment:footnotes;
	padding:4px 20px;
}
.footnotelist > li::before{
	content:'※' counter(footnotes);
	margin-right:10px;
}
.footnotelist > li:nth-child(odd){ background:#eee; }
#randx_plans_trial{
	border:1px solid #ccc;
	display:flex;
	align-items:stretch
}
#randx_plans_trial > h3{
	background:rgb(243,170,184);
	color:white;
	font-weight:bold;
	font-size:24px;
	line-height:1;
	width:200px;
	padding:20px;
	text-align:center;
}
#randx_plans_trial > h3 > small{
	font-size:16px;
	font-weight:normal;
}
#randx_plans_trial > p{
	width:100%;
	font-weight:bold;
	font-size:18px;
	padding:20px;
	text-align:center;
	align-self:center;
}
#randx_plans_trial > p > em{ color:rgb(102,202,143); }
#randx_plans_gallery{ background:rgb(150,206,231); }
@media screen and (max-width: 768px){
	.randx_pricetable{ overflow-x:scroll; }
	.randx_pricetable > table{ min-width:640px; }
	.randx_pricetable thead > tr > th:not([colspan]),
	.randx_pricetable tbody > tr > td{
		font-size:20px;
		width:100px;
	}
	.randx_pricetable tbody > tr > th[rowspan]{ width:60px; }
	.randx_pricetable tbody > tr > th[colspan]{ width:160px; }
	.randx_pricetable tbody > tr > th:not([colspan]):not([rowspan]){ width:100px; }
	.randx_pricetable thead > tr > th{
		font-size:16px;
		line-height:1.3;
	}
	.randx_pricetable tbody > tr > th:not([colspan]):not([rowspan]){ width:60px; }
	.randx_pricetable thead > tr > th{ font-size:20px; }
	.randx_pricetable thead > tr > th > small{ font-size:14px; }
	.randx_pricetable tbody > tr > th{ font-size:14px; }
	#randx_plans_trial > h3{ font-size:20px; }
	#randx_plans_trial > h3 > small{ font-size:14px; }
	#randx_plans_trial > p{ font-size:16px; }
	#randx_plans > .base > .flex > h3 > img{ max-width:200px; }
}

/* みつわポンプとは */
#randx_about{
	background:rgb(234,245,250);
}
#randx_about > .base > .flex > section > h3{
	font-size:25px;
	font-weight:bold;
	color:white;
	margin:-10px 0 15px 10px;
}
#randx_about > .base > .flex > section > h3 > span{
	background:rgb(46,157,208);
	display:inline-block;
	padding:2px 15px;
	margin:2px 0;
}
@media screen and (max-width: 768px){
	#randx_about > .base > .flex > section > h3{ font-size:20px; }
}

/* よくあるご質問 */
#randx_faq{ background:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/article/iot/randx/faq_bg.png") scroll no-repeat center center / cover; }
#randx_faq > .base > div{
	background:white;
	margin:0 20px;
	padding:100px 20px 20px;
	position:relative;
}
#randx_faq > .base > div > img{
	position:absolute;
	top:-100px;
	right:20px;
	height:230px;
}
#randx_faq > .base > div > aside > img{ position:absolute; }
#randx_faq > .base > div > aside > img:nth-child(1){
	top:400px;
	right:-250px;
}
#randx_faq > .base > div > aside > img:nth-child(2){
	top:800px;
	left:-300px;
}
#randx_faq > .base > div > aside > img:nth-child(3){
	top:1200px;
	right:-280px;
}
#randx_faq > .base > div > aside > img:nth-child(4){
	top:1600px;
	left:-280px;
}
#randx_faq > .base > div > aside > img:nth-child(5){
	bottom:-80px;
	right:-350px;
}
#randx_faq > .base > div > section{ margin:30px 0; }
#randx_faq > .base > div > section > h3{
	background:rgb(46,157,208);
	color:white;
	font-weight:bold;
	font-size:20px;
	padding:10px 10px 10px 60px;
	position:relative;
}
#randx_faq > .base > div > section > h3::before{
	content:'Q';
	font-size:20px;
	color:white;
	display:block;
	position:absolute;
	top:0;
	left:0;
	width:40px;
	height:52px;
	background:rgb(32,64,154);
	text-align:center;
	display:flex;
	flex-direction:column;
	justify-content:center;
}
#randx_faq > .base > div > section > h3::after{
	content:'';
	display:block;
	position:absolute;
	top:0;
	left:40px;
	width:0;
	height:0;
	border-left:10px solid rgb(32,64,154);
	border-top:26px solid transparent;
	border-right:10px solid transparent;
	border-bottom:26px solid transparent;
}
#randx_faq > .base > div > section > div{
	position:relative;
	padding-left:50px;
	padding-top:10px;
}
#randx_faq > .base > div > section > div::before{
	content:'A.';
	font-size:20px;
	display:block;
	position:absolute;
	font-weight:bold;
	top:0;
	left:0;
	width:45px;
	height:40px;
	color:rgb(32,64,154);
	text-align:center;
	display:flex;
	flex-direction:column;
	justify-content:center;
}
#randx_faq > .base > div > section > div > section{ margin:20px 0; }
#randx_faq > .base > div > section > div > section > h4{
	font-size:20px;
	font-weight:bold;
}
#randx_faq > .base > div > section > div > section > section{ margin:10px 0; }
#randx_faq > .base > div > section > div > section > section > h5{
	font-weight:bold;
	color:rgb(46,157,208);
}
#randx_faq > .base > div > section > div > section > section > .note{ margin:10px 0; }
@media screen and (max-width: 1350px){
	#randx_faq > .base > div > aside{ display:none; }
}
@media screen and (max-width: 768px){
	#randx_faq > .base > div > img{
		top:-40px;
		height:170px;
	}
	#randx_faq > .base > div > section > h3{ font-size:16px; }
	#randx_faq > .base > div > section > h3::before{ height:45.6px; }
	#randx_faq > .base > div > section > h3::after{
		border-top-width:22.8px;
		border-bottom-width:22.8px;
	}
}

/* お問い合わせ・資料請求 */
#randx_contact > .base > .flex > h3{
	font-size:20px;
	font-weight:bold;
	text-align:center;
}
#randx_contact > .base > .flex > textarea{
	background:#f5f5f5;
	border:1px solid #ccc;
	padding:10px;
	height:300px;
}
.randx_contactbox{
	text-align:center;
	padding:40px 20px;
}
.randx_contactbox > a{
	display:inline-block;
	background:rgb(213,235,245);
	transition:box-shadow .2s,top .2s ease;
	box-shadow:0 0 0 rgba(0,0,0,0);
	border-radius:10px;
	position:relative;
	top:0;
}
.randx_contactbox > a.hover{
	box-shadow:4px 10px 10px rgba(0,0,0,.2);
	top:-5px;
}

/**
 * 投稿コンテンツ
----------------------------------------------------------------*/
#post{
	background:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/interface/theme/loopbg_grid.png") scroll repeat center center;
	padding-top:60px;
	padding-bottom:80px;
}
#post > *{
	max-width:1024px;
	margin:0 auto;
}
.single_post_post{
	line-height:2;
	background:rgba(255,255,255,.8);
	padding:40px;
	margin:0 20px 40px;
}
.post_post > figure:first-child{ margin-bottom:20px; }
@media screen and (max-width: 768px){
	.post_post{ padding:40px 20px; }
}

#post h2:not(.h2){
	font-size:50px;
	font-weight:bold;
	padding:60px 20px 20px;
}
#post h3{
	font-size:30px;
	font-weight:bold;
	padding:0 20px;
}
#post h4{
	font-size:20px;
	font-weight:bold;
}
.post_post h2:not(.h2){
	font-size:30px !important;
	font-weight:bold;
	padding:40px 0 20px !important;
}
.post_post h2:first-child:not(.h2){ padding-top:0 !important; }
.post_post h3{
	font-size:24px !important;
	font-weight:bold;
	padding:0 20px !important;
}
.post_post h4{
	font-size:18px !important;
	font-weight:bold;
}
.post_post .wp-block-image{ margin:20px 0; }
.post_post strong{ color:rgb(32,64,154); }
.post_post em{ text-decoration:underline; }
.post_post a{
	color:rgb(41,170,225);
	font-weight:bold;
	text-decoration:underline;
	transition:color .2s;
}
.post_post a:hover{ color:rgb(-66,127,210); }
.post_post .wp-block-columns{
	gap:40px;
	margin:40px 0;
}
@media screen and (max-width: 768px){
	#post h2:not(.h2){ font-size:24px; }
	#post h2 br{ display:none; }
	#post h3{ font-size:18px; }
	#post h4{ font-size:16px; }
}

#post .wp-block-columns{
	padding:40px 20px;
	box-sizing:border-box;
}

/* 特徴 */
#post .future h3{
	font-weight:bold;
	font-size:18px;
	color:rgb(32,64,154);
	padding:0 0 0 10px;
	border-left:10px solid rgb(32,64,154);
	margin-bottom:10px;
	text-align:justify;
}
#post .future p:not(:last-of-type){ margin-bottom:20px; }
#post .future ul:not(:last-of-type){ margin-bottom:20px; }
#post .future ul > li::before{
	content:'●';
	color:rgb(32,64,154);
}
#post[name="pumps_swm"] .future h3,
#post[name="pumps_cwm"] .future h3{
	color:rgb(225,62,18);
	border-color:rgb(225,62,18);
}

/* 用途 */
.usefulness{
	max-width:768px;
	box-sizing:border-box;
	margin:0 auto;
	padding:20px;
}
.usefulness > li{
	font-weight:bold;
	font-size:20px;
}
.usefulness > li:not(:last-child){ margin-bottom:20px; }
.usefulness > li::before{
	content:'●';
	color:rgb(32,64,154);
}

/* マジカルポンプ背景・文字色 */
#post[name="pumps_cwm"]{
	background:black;
	color:white;
}
#post[name="pumps_swm"]{ background:rgb(218,218,220); }
#post[name="pumps_cwm"] strong,
#post[name="pumps_swm"] strong{ color:rgb(225,62,18); }

/* マジカルポンプカバー */
#post .magicalcover{
	max-width:none;
	width:100%;
}
#post .magicalcover figure:first-child{}
#post .magicalcover figure:last-child{ display:none; }
#post .magicalcover figure img{
	max-width:none;
	width:100%;
}
@media screen and (min-width: 769px) and (max-width: 1024px){
	#post .magicalcover figure{ overflow:hidden; }
	#post .magicalcover figure img{
		width:150%;
		margin:0 -25%;
	}
}
@media screen and (max-width: 768px){
	#post .magicalcover figure:first-child{ display:none; }
	#post .magicalcover figure:last-child{ display:block; }
}

/**
 * ブロックエディタ
----------------------------------------------------------------*/
/* 商品説明 */
#product_summary{
	max-width:none;
	background:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/article/pumps/bg_summary.png") scroll no-repeat center center / cover;
	padding:120px 20px;
	margin:40px 0;
}
#product_summary > .base> p{
	font-size:20px;
	font-weight:bold;
	text-align:center;
	color:white;
}
@media screen and (max-width: 768px){
	#product_summary{
		background-image:url("https://mitsuwapump.jp/wp-content/themes/mitsuwapump/image/article/pumps/bg_summary_sp.png");
		text-align:left;
	}
}

/**
 * フォーム
----------------------------------------------------------------*/
.richform{ font-size:18px; }
.richform label{ display:block; }
.richform .buttons br{ display:none; }
span.wpcf7-form-control,
span.wpcf7-list-item{ display:block !important; }
.frame{
	border-radius:.3em;
	background:#f5f5f5;
	font-size:12px;
	padding:10px;
	border:1px solid #ccc;
	height:200px;
	overflow-y:scroll;
}