@charset "UTF-8";
@font-face {font-family: 'Font Awesome 5 Brands';font-style: normal;font-weight: 400;src: url(https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.6.3/webfonts/fa-brands-400.woff2) format('woff2');font-display: swap;}
@font-face {font-family: 'Font Awesome 5 Free';font-style: normal;font-weight: 900;src:url(https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.6.3/webfonts/fa-regular-400.woff2) format('woff2'),url(https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.6.3/webfonts/fa-solid-900.woff2) format('woff2');font-display: swap;}
@font-face{font-family: 'slick';font-weight: normal;font-style: normal;src: url(https://meteorelay.jp/services/fonts/slick.woff) format('woff');font-display: swap;}
/* Reset */
*,*:before,*:after {box-sizing: border-box;}
ul {list-style:none;}
ul,li {margin:0; padding:0;}
ol {padding:0 0 0 0.25em; margin:0 0 1em 1.5em;}
ol li {margin-bottom:0.5em;}
a {color:#000; text-decoration:none; outline:none;}
img {vertical-align:middle;}
dl,dt,dd {margin:0;}
address,caption,em,th {font-style:normal;}
/* Fluid-img */
img {width:100%; height:auto;}
/* --------------------------------------------------
	ベース
-------------------------------------------------- */
html {color:#222;font-family: -apple-system,BlinkMacSystemFont,"Helvetica Neue",Helvetica,"Hiragino Sans","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-size:3.733vw; line-height:1.5; height:100%;}/* 基準フォントサイズは14px */
body {margin: 0;}
body.fixing-body {position: fixed; width:100%; height:100%;}
body#home {background: none; overflow-x: hidden;}
/* --------------------------------------------------
	共通
-------------------------------------------------- */
/* PC用のもは非表示 */
.pc_only {display:none !important;}
.pc_only_br {display:none !important;}
/* 見出し一旦クリア */
h1,h2,h3,h4,h5,h6 {margin:0 0 0.5em; font-size:1em;}
/* 段落 */
p {margin:0 0 0.75em;}
/* 文字サイズ */
.small { font-size: 0.8em;}
/* セクション見出し & ページタイトル */
#page_ttl,.sec_ttl {text-align:center; letter-spacing:0.2em; margin-bottom:1.5em; position:relative; line-height: 1.8}
#page_ttl:before,.sec_ttl:before {content:''; background-image: url(../images/tti_icon_01.png); background-repeat: no-repeat; width: 22px; height: 20px; position:absolute; top:0.4em; left:8%; display:block;}
#page_ttl:after,.sec_ttl:after {content:''; background-image: url(../images/tti_icon_01.png); background-repeat: no-repeat; width: 22px; height: 20px; position:absolute; top:0.4em; right:8%; display:block;}
#page_ttl h2,.sec_ttl h2 {font-size:1.2em;font-style: italic;margin-bottom:0; display:inline-block;padding:0 1em; position:relative; z-index:1;}
#page_ttl h1,.sec_ttl h1 {margin-bottom:0; font-weight: normal;font-size:0.875em;}
/* 写真・図版 */
figure {margin:0;}
/* インデント */
.indent {text-indent:-1em; margin-left:1em;}
/* クリアフィックス */
.clearfix:after {content: ""; clear: both; display: block;}
/* ノーマルリスト */
.normal_list {list-style:disc; margin-left:1.5em; margin-bottom:1em;}
.normal_list.square {list-style:square;}
.normal_list.decimal {list-style:decimal;}
.normal_list li {margin-bottom:1em;}
/* 注意書きリスト */
.caution_list {margin-bottom:1em;}
.caution_list li {text-indent:-1em; margin-left:1em;}
.caution_list li:before {content:"※";}
.caution_list li ul {margin-top:0.5em;}
.caution_list li li {text-indent:0; margin-left:0;}
.caution_list li li:before {display:none;}
/* インラインブロック（ウインドウ幅によって途中で改行される場合にキレのいいところで改行させるため） */
.inline_block {display:inline-block;}
/* Flexboxレイアウト */
.flex {display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; justify-content:space-between;}
/*ボタン*/
.btn1{ width: 70%; position: relative; margin: 0 auto;}
.btn1 a{padding: 8% 0; font-size: 88%; font-weight: 700;background: -moz-linear-gradient(right, #14a891, #4bd6c1);background: -webkit-linear-gradient(right, #14a891, #4bd6c1);background: linear-gradient(to right, #14a891, #4bd6c1);position: relative;display: block;color: #fff;cursor: pointer;text-align: center;
box-shadow: 3px 3px 4px rgba(0,0,0,0.2);}
.btn1 a:before{ font-size: 120%; position:absolute; top: 25%; left: 6%; font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f1d8"; margin-right:1%;}
.btn1 a:hover{background: -moz-linear-gradient(right, #4bd6c1, #14a891);background: -webkit-linear-gradient(right, #4bd6c1, #14a891);background: linear-gradient(to right, #4bd6c1, #14a891);}
.btn10 a{display:block;text-align: center;background-color:rgba(9, 186, 147,0.9);border: 1px solid #09ba93;color: #fff;text-decoration: none;padding:0.5vw 5.5vw;margin: 1vw auto 2vw; cursor: pointer; border-radius: 4px;}
.btn10 a:hover {color:#09ba93;background-color:rgba(255,255,255,0.8);}
.btn10 a:hover:after {font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f30b"; margin-left:0.5em; color: #09ba93;}
.btn20 {display: inline-block; text-align: center; background-color: #004063; border: 1px solid #004063; color: #004063; text-decoration: none; font-weight: bold; padding:3.6vw 10.5vw; border-radius: 4px; position: relative; margin: 4vw auto 8vw; font-size: 0.95em;}
.btn20 span {position: relative;z-index: 1;}
.btn20:before,.btn20:after {content: "";display: block;background-color: #fff;width: 50%;height: 100%;position: absolute;top: 0;transition: .2s;}
.btn20:before {left: 0;}
.btn20:after {right: 0;}
.btn20:hover:before,.btn20:hover:after {width: 0;background-color: #fff;}
.btn20:hover {color: #FFF;}
.btn_area{ text-align: center;}
.btn_area li a{ width: 70%; padding: 20px 0;}
.btn30 { display: inline-block;text-align: left;background-image: linear-gradient(#eaeaea 0%, #c6c6c6 100%);box-shadow: inset 0 2px 0 rgba(255,255,255,0.5), 0 2px 2px rgba(0, 0, 0, 0.19);color: #555;text-decoration: none;font-weight: bold;text-shadow: 1px 1px 1px rgba(255, 255, 255, 1);padding: 12px 24px;border-radius: 4px;cursor: pointer;}
.btn30:hover { opacity: 0.8;}
.more{ margin: 1vw auto 8vw; text-align: center;}
/*文字位置*/
.center{ text-align: center;}
/*文字太さ*/
.bold{ font-weight: bold;}
/*文中リンク*/
.for{color: #0E4E77; margin: 0 1%;}
.for:after {font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f35a"; margin-left:0.5em;}
.forpdf{color: #0E4E77; margin: 0 1%;}
.forpdf:after {font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f1c1"; margin-left:0.5em; color: #C1272A;}
/*iframe*/
iframe{ width: 100%; height: 60vw;}
/* --------------------------------------------------
フォーム
-------------------------------------------------- */
/* 入力エリア */
input,input[type="search"],textarea {-webkit-appearance: none; background-color:#fff; border:1px solid #ccc; border-radius:4px; padding:8px; width:100%; box-sizing:border-box; line-height:1.4; font-size: 16px;}
textarea {height:10em;}
::-webkit-input-placeholder {color:#999;}
input.number{width: 20% !important;}
input[type="submit"]{display: inline-block;padding: 1em 2em;text-decoration: none;border-radius: 3px;font-weight: bold;color: #FFF;background-image: -webkit-linear-gradient(#54b1e5 0%, #2E8BC0 100%);background-image: linear-gradient(#54b1e5 0%, #2E8BC0 100%);transition: .4s;border: none;cursor: pointer;font-size: 1em;}
input[type="submit"]:hover{background-image: -webkit-linear-gradient(#145DA0 0%, #2E8BC0 100%);background-image: linear-gradient(#145DA0 0%, #2E8BC0 100%);}
select{width:100%; background:#fff; border:#ccc 1px solid; padding:8px;box-sizing:border-box; border-radius:4px; margin: 0 0 2%; font-size: 16px;}
label {position: relative;}
label:after {position:absolute;top:30%;right: .5em;width: 0;height: 0;padding: 0;content: '';border-left: 6px solid transparent;border-right: 6px solid transparent;border-top: 8px solid #666;
pointer-events: none;}
/* formstyle01 */
.formstyle01 dt{ margin: 0 0 0.6% 0; font-weight: bold;}
.formstyle01 dt:before { content: '●'; color:#73C2B5; position:relative; margin: 0 5px 0 0; font-size: 80%;}
.formstyle01 dd{ margin:0 0 2.4% 0;}
/* submitボタン */
button {border:none;background-color:#D7D7D7; border-radius:8px; }
button a {display:inline-block; line-height:1; padding:0.7em 2.6em;}
button a i { margin: 0 1vw 0 0;}
button:hover{background-color:#B9B9B9;}
/* 説明エリア */
.inst01{ display: block; padding: 2%; background: #F8FAFC; font-size: 0.96em; border-radius: 4px;}
.submit{ width: 50%; margin: 0 auto; text-align: center;}
.backbtn {margin: 2% auto;}
.backbtn a{display: block;width: 100%;text-align: center;padding: 1em 2em;text-decoration: none;border-radius: 3px;font-weight: bold;background-image: -webkit-linear-gradient(45deg, #DEE2EC 0%, #E2E4E7 100%);background-image: linear-gradient(45deg, #DEE2EC 0%, #E2E4E7 100%);transition: .4s;border: none;cursor: pointer;   font-size: 1em;color: #777 !important;}
.backbtn a:hover{background-image: -webkit-linear-gradient(45deg, #E2E4E7 50%, #DEE2EC 100%);background-image: linear-gradient(45deg, #E2E4E7 50%, #DEE2EC 100%);}
.sendpage_btn {margin: 2% auto;}
.sendpage_btn a{display: block;width: 100%;text-align: center;padding: 1em 2em;text-decoration: none;border-radius: 3px;font-weight: bold;color: #FFF !important;background-image: -webkit-linear-gradient(45deg, #2E8BC0 0%, #B1D4E0 100%);background-image: linear-gradient(45deg, #2E8BC0 0%, #B1D4E0 100%);transition: .4s;border: none;cursor: pointer;font-size: 1em;}
.sendpage_btn a:hover{background-image: -webkit-linear-gradient(45deg, #145DA0 50%, #2E8BC0 100%);background-image: linear-gradient(45deg, #145DA0 50%, #2E8BC0 100%);}
.red{color: #c02e5e;}
.red_hissu{background-color:#e18895;color:#fff;padding:0.1em 0.2em;border-radius:4px;}
/* --------------------------------------------------
	スライドショー　slick.jsのデフォルトcssを調整
-------------------------------------------------- */
.slick-dotted.slick-slider {margin-bottom:7vw;}
.slick-prev:before, .slick-next:before {display:block;color: #8A8A8A !important; position: relative;}
.slick-prev:before{font-family: "Font Awesome 5 Free" !important; font-weight: 900; content:"\f104" !important; margin-right:2.5em !important;}
.slick-next:before{font-family: "Font Awesome 5 Free" !important; font-weight: 900; content:"\f105" !important; margin-left:0.5em !important;}
.slick-prev, .slick-next {width:7vw; height:7vw; z-index:1;}
.slick-prev {left:2vw;}
.slick-next {right:2vw;}
.slick-dots {bottom:-6vw;}
.slick-dots li {width:10px !important; height:10px !important; margin:0 1.5vw;}
.slick-dots li button {width:10px !important; height:10px !important; padding:0; font-size: 0 !important;}
.slick-dots li button:before {display:block; width:8px !important; height:8px !important; content:""; background-color:#c4c4ba; border-radius:50%; opacity:1; font-size: 0 !important;}
.slick-dots li.slick-active button:before {background-color:#96968a;}
/* スライドショー・ナビゲーター */
.slider-nav img {cursor:pointer; opacity:0.5;}
.slider-nav .slick-list {padding:2.667vw;}
.slider-nav .slick-slide {position:relative; background-color:#fff;}
.slider-nav .slick-active {outline: none;}
.slider-nav .slick-active img {opacity:1;}
.slider-nav .slick-active:after {content:""; position:absolute; top:0; left:0; display:block; width:100%; height:100%; border:1px solid #a5a592; }
.slick-slide{ padding: 0 15px; text-align: center;}
.slick-slide img{ margin-bottom: 10px;}
/* --------------------------------------------------
	固定ヘッダ＋Gナビ
-------------------------------------------------- */
#fixed_box {width:100%; position:fixed; top:0; left:0; /*background-color:#fff;*/ z-index:101; transition: all 0.25s ease;}
.is-fixed #fixed_box {box-shadow: 0 5px 5px 0 rgba(0,0,0,0.05); width: 100%; position: relative;}
/* --------------------------------------------------
	ヘッダ
-------------------------------------------------- */
/* ヘッダー */
#header {width:100%; height:24vw; line-height:1; z-index:100; position:relative; font-style: italic;}
.is-fixed #header {height:16vw; background: #fff;}
#main_head h1 {position:absolute; top:4.67vw; left:4.67vw; width:30.33vw; margin:0;}
#main_head .coupon {position:absolute; bottom:1vw; left:0; width:100%; -webkit-order:1; order:1; background:url(../images/bg_pattern02.png) repeat-x,url(../images/bg_pattern03.png) repeat-x left bottom,url(../images/bg_pattern01.png); background-size:14.5px 1px,14.5px 1px,6px 6px; font-size:0.8em; text-align:center; line-height:2.5;}
.is-fixed #main_head .coupon {display:none;}
#main_head .coupon h2 {display:inline; margin-right:0.5em;}
#main_head .coupon p {display:inline;}
#main_head .coupon p .tax {font-size:0.9em;}
#main_head .coupon p strong {color:#a03025;}
#main_head .coupon p.caution {display:none;}
#main_head .store_cntrol {position:absolute; top:2.67vw; left:24vw; width:58.4vw;}
#main_head .store_cntrol nav,#header .store_cntrol .cart {width:100%;}
#main_head .store_cntrol .cart li {width:49%;}
#main_head .store_cntrol .cart a {display:block; background:url(../images/bg_pattern01.png); background-size:6px 6px; border-radius:10vw; line-height:10vw; text-align:center; color:#a03025; font-weight:bold;}
/* メニュートグル＆ハンバーガーアイコン */
.drawer_toggle {position:absolute; top:3.67vw; right:3.67vw; width:6.67vw; height:8vw; cursor:pointer;}
.drawer_toggle span {display:block; position:absolute; top:calc(50% - 1px); left:0; content:""; width:100%; height:2px; background-color:#333; transition: all 0.25s ease;}
.drawer_toggle span:nth-child(1) {margin-top:-35%;}
.drawer_toggle span:nth-child(3) {margin-top:35%;width:4.67vw; text-align: right;}
/* メニュートグル＆クローズアイコン */
.open .drawer_toggle span:nth-child(2) {display:none;}
.open .drawer_toggle span:nth-child(1) {margin-top:0;
transform: rotate(45deg);-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-o-transform: rotate(45deg);}
.open .drawer_toggle span:nth-child(3) {margin-top:0;transform: rotate(-45deg);-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);-o-transform: rotate(-45deg);width:6.67vw;}
/* --------------------------------------------------
	Gナビ
-------------------------------------------------- */
#headerarea{width:100%; position:relative; z-index: 100; box-sizing: border-box; padding:0;}
#headerarea:after{content:"";clear:both;display:block}
.is-fixed #headerarea {display: block; position:fixed; top:0; left:0; margin-bottom:0; box-shadow: 0 5px 5px 0 rgba(0,0,0,0.05); background: rgba(255,255,255,0.8);}
.logo{display: block;/*float:left;*/padding:0;width:12%; margin: 2% auto;}
.logo a{font-size:28px;display:block;padding:0 0 0 20px}
.is-fixed .logo{padding:0; position: relative; /*top:2.8vw;*/}
nav#header_navi{ display: none; float:right; padding: 0.8vw 1vw 0 0;}
nav#header_navi>ul{float:left;position:relative}
nav#header_navi li{list-style:none;float:left;}
nav#header_navi li a.nav01{padding: 2vw 1vw 1vw;/*margin: 0 2vw 0 0;*/ letter-spacing: 0.1em; box-sizing: border-box;}
nav#header_navi li a.nav01 span{ display: block; width: 100%; font-size: .8em; text-align: center; padding: 4px 0; font-style: normal; font-weight: normal;}
nav#header_navi li a.nav01 img{width: 30px; height: auto;}
/* --------------------------------------------------
	ページトップ
-------------------------------------------------- */
#backToTop {position:fixed; cursor:pointer; transition: all 0.25s ease; z-index:1; ont-size: 0.875em; text-align: center; padding: 10px;}
#backToTop i{ display: block;margin: 0 0 5px;}
/* --------------------------------------------------
	フッター
-------------------------------------------------- */
#footer {padding:1vw 0 44vw;}
/* フッタナビ共通  */
#footer_navi > div {width:100%;}
#footer_navi .about,#footer_navi .etc{width:48%;}
#footer_navi {width:80%; margin: 0 auto;}
#footer_navi h3 {margin: 1.2vw 0; font-weight: normal;}
#footer_navi ul {margin-bottom:2em;}
#footer_navi li {margin-bottom:0.75em;}
#footer_navi li:last-child {margin-bottom:0;}
#footer_navi .about li { text-align: center;}
#footer_navi .location {}
#footer_navi .location h2:before {display:none;}
#footer_navi .location li {font-size:0.8em; margin-bottom:0.5em; text-indent:-1em; margin-left:1em;}
#footer_navi .location .pan,#footer_navi .location .pan ul:first-child {margin-right:0.5em;}
#footer_navi .location02{ text-align: center;}
#footer_navi .location02 h1{ width: 50%; margin: 4vw auto;}
#footer_navi .etc {}
#footer_navi .etc li { text-align: center;}
#footer_navi .etc li:nth-child(odd) {margin-right:0.5em;}
#footer .copyright {text-align:center; margin: 4vw 0 0; font-size: 0.7em;}
/* --------------------------------------------------
	トップページ
-------------------------------------------------- */
#top_contents {margin:0;}
#top_contents > section {margin-bottom:10vw;}
/* メインビジュアル */
/*#top_mv {position:relative;width:100%; height: auto; margin: 0 auto !important; padding-bottom:0 !important;}*/
#top_mv {position:relative;width:100%; height: auto; margin: 0 auto !important; padding-bottom:6% !important;}
/*#top_mv .lead {width:90%; padding:40vw 0 12vw; margin: 4vw auto 12vw;}*/
#top_mv .lead {width:92%; padding:24vw 0 55vw; margin: 0 auto; position: relative;}
#top_mv .lead h2 {font-size:1.1em;　margin-bottom:0.25em; text-shadow:2px 2px 0 rgba(255,255,255,0.9); margin-bottom: 10vw; text-align: center;}
#top_mv .lead h2 span{ display: block; width: 100%;}
#top_mv .lead h2 span.t01{ font-size:1.4em; margin-bottom: 3.2vw;}
#top_mv .lead h2 span.t02{ align-items: center; display: flex; color:#a81f28; font-size:1.4em; margin-bottom: 3.2vw; justify-content: center;}
#top_mv .lead h2 span.t02:before{font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f10d"; margin-right:1%; font-size: 34%;}
#top_mv .lead h2 span.t02:after{font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f10e"; margin-left:1%; font-size: 34%;}
#top_mv .lead h2 span.t03{ font-size:1.4em;}
#top_mv .lead p {font-size:1.2em; font-style: italic; margin: 1.2vw 0;}
/* メインビジュアル背景1 緑グラデ */
#top_mv.bg_b1,#top_mv.bg_b2,#top_mv.bg_b3,#top_mv.bg_b4,#top_mv.bg_b5,
#top_mv.bg_b6,#top_mv.bg_b7,#top_mv.bg_b8,#top_mv.bg_b9,#top_mv.bg_b10 {
background-image: url(../img/main11_bg11_3.png); background-size: cover; background-repeat: repeat; background-position:right bottom;}
/* メインビジュアル背景1 グレー */
#top_mv.bg_b1_2,#top_mv.bg_b2_2,#top_mv.bg_b3_2,#top_mv.bg_b4_2,#top_mv.bg_b5_2,
#top_mv.bg_b6_2,#top_mv.bg_b7_2,#top_mv.bg_b8_2,#top_mv.bg_b9_2,#top_mv.bg_b10_2 {
background-image: none; background-color:#F5F6F7;}
/* メインビジュアル背景2 */
#top_mv .lead.bg_a1 {background-image: url(../img/main11.png); background-position: bottom; background-repeat: no-repeat; background-size: 62%;}
#top_mv .lead.bg_a2 {background-image: url(../img/main12.png); background-position: bottom; background-repeat: no-repeat; background-size: 90%;}
#top_mv .lead.bg_a3 {background-image: url(../img/main13.png); background-position: bottom; background-repeat: no-repeat; background-size: 90%;}
#top_mv .lead.bg_a4 {background-image: url(../img/main15.png); background-position: bottom; background-repeat: no-repeat; background-size: 90%;}
#top_mv .lead.bg_a5 {background-image: url(../img/main16.png); background-position: bottom; background-repeat: no-repeat; background-size: 90%;}
#top_mv .lead.bg_a5 {background-image: url(../img/main17.png); background-position: bottom; background-repeat: no-repeat; background-size: 80%;}
#top_mv .lead.bg_a7 {background-image: url(../img/main18.png); background-position: bottom; background-repeat: no-repeat; background-size: 85%;}
#top_mv .lead.bg_a8 {background-image: url(../img/main19.png); background-position: bottom; background-repeat: no-repeat; background-size: 90%;}
#top_mv .lead.bg_a9 {background-image: url(../img/main20.png); background-position: left 60% bottom 0; background-repeat: no-repeat; background-size: 44%;}
/* 弊社Webディレクターがお客様のWebサイトのコンシェルジュです */	
.concierge { width: 100%; height: auto; position: relative; padding:4%; margin:0 auto; background-image: url(../img/concierge_bg01_2.png); background-size: cover; background-position: right;}
.concierge .c_inner{ width: 100%; position: relative;}
.concierge .text { position: relative; width: 100%; color:#FCF0E4; font-size: 1.1rem; font-weight: 700; line-height: 1.8;}
.concierge .text span { font-size: 1.2rem; }
.concierge .text a{ color: #DD5C5E;}
.concierge2 { width: 100%; height: auto; position: relative; padding:8% 4%; margin:0 auto; background-image: url(../img/concierge_bg01_6.png); background-size: cover; background-position: right;}
.concierge2 .c_inner{ width: 100%; position: relative;}
.concierge2 .text { position: relative; width: 100%; color:#FCF0E4; font-size: 0.97rem; font-weight: 700; line-height: 1.8; margin: 0;}
.concierge2 .text span { font-size: 1.2rem; }
.concierge2 .text a{ color: #DD5C5E;}
.inquiryarea {display: flex; flex-wrap: wrap;}
.inquiryarea li{ display: block; margin: 0 2% 3% 0; text-align: center;}
.inquiryarea li a{ display: block; color: #fcf0e4; border-radius: 100px; position: relative;}
.inquiryarea li.btn001,.inquiryarea li.btn002,.inquiryarea li.btn003,.inquiryarea li.btn004{ display: none;/*width:48%; position: relative;*/}
.inquiryarea li.btn001 a {padding: 10% 0 10% 6%; font-size: 88%; font-weight: 700;	background: -moz-linear-gradient(right, #14a891, #3fbfab);background: -webkit-linear-gradient(right, #14a891, #3fbfab);background: linear-gradient(to right, #14a891, #3fbfab);}
.inquiryarea li.btn001 a:before{font-size: 120%; position:absolute; top: 25%; left: 6%; font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f1d8"; margin-right:1%;}
.inquiryarea li.btn002 a {padding: 10% 0 10% 6%; font-size: 88%; font-weight: 700;	background: -moz-linear-gradient(right, #f12545, #F9739C);background: -webkit-linear-gradient(right, #f12545, #F9739C);background: linear-gradient(to right, #f12545, #F9739C);}
.inquiryarea li.btn002 a:before{ 
font-size: 120%; position:absolute; top:25%; left: 8%; font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f0e0"; margin-right:1%;}
.inquiryarea li.btn003 {width:100%; border-radius: 10px;background:rgba(252, 240, 228,0.75); padding: 1%; color: #144584;}
.inquiryarea li.btn003:before{ position:absolute; left: 2%; font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f05a"; margin-right:1%; font-size: 200%;}
.inquiryarea li.btn004{ width:100%; position: relative;}
.inquiryarea li.btn004 a{padding: 4% 0; font-size: 88%; font-weight: 700;	background: -moz-linear-gradient(right, #FF886D, #ffa18c);background: -webkit-linear-gradient(right, #FF886D, #ffa18c);background: linear-gradient(to right, #FF886D, #ffa18c);}
.inquiryarea li.btn004 a span{ /*font-size: 110%; font-style: italic; font-weight: 700;*/ display: none;}
.inquiryarea li.btn004 a:before{ 
font-size: 160%; position:absolute; top:20%; left: 5%; font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f3cd"; margin-right:1%;}
/* メテオリレイがこの10年で培った5つのチカラ */
#top_mv2 { margin-bottom:0 !important; padding-bottom:0px !important;}
#top_mv2 .strong_point {position: relative; width:100%; margin: 0 auto; padding: 0 2.6% 5.2vw; background-color:rgba(244,244,244,1.0); text-align: center;}
#top_mv2 .strong_point ul {display: flex;justify-content: center; align-content: center; flex-wrap: wrap; width: 98%; margin: 0 auto;}
#top_mv2 .strong_point li {position: relative;display:block; width: calc(98%/2); margin:0 auto 5%; font-size: .8em;}
#top_mv2 .strong_point li p {margin: 0; padding: 0;}
#top_mv2 .strong_point li strong{ font-weight: bold; font-size: 1.54em;}	
#top_mv2 .strong_point li strong:before{font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f292"; margin-right: 2%; font-size: 80%;}
#top_mv2 .strong_point li .icoimg01 { background: #fff; padding: 16%; border-radius: 50%; width: 120px; height: 120px; margin: 0 auto 5%; filter: drop-shadow(2px 2px 2px rgba(0,0,0,0.03));}
#top_mv2 .strong_point li .icoimg01 img { width: 100%; height: auto;}
#top_mv2 .strong_point li.s01 strong{ background:linear-gradient(transparent 75%, #7fff7f 75%);font-weight:bold; }	
#top_mv2 .strong_point li.s02 strong{ background:linear-gradient(transparent 75%, #ffdc00 75%);font-weight:bold; }	
#top_mv2 .strong_point li.s03 strong{ background:linear-gradient(transparent 75%, #9eceff 75%);font-weight:bold; }	
#top_mv2 .strong_point li.s04 strong{ background: linear-gradient(transparent 75%, #FEA38D 75%);font-weight: bold;}	
#top_mv2 .strong_point li.s05 strong{ background:linear-gradient(transparent 75%, #C49FF6 75%);font-weight:bold;}
#top_mv2 .strong_point li.s06 strong{ background:linear-gradient(transparent 75%, #B5E61D 75%);font-weight:bold;}	
/*弊社サイト制作のコスパが良い理由*/
#top_reason {position:relative; width: 100%; margin-bottom:0 !important; padding-bottom: 10vw}
#top_reason .catch	{ text-align: center; margin: 0 0 3%;}
#top_reason img{ width: auto; height: auto;}
/*Wordpress制作に弊社が選ばれる理由*/	
#top_reason2{background-color: rgba(244,244,244,0.5); padding-bottom:10vw; margin-bottom: 0 !important;}
#top_reason2 .circle5 {margin-top: 3vw;}	
#top_reason2 .circle5 li { margin: 0 auto 2vw; background:#fff; padding: 4% 6%; width: 88%; box-shadow: 2px 2px 0 #ccc;}
#top_reason2 .circle5 li:last-child {margin-bottom: 0;}	
#top_reason2 .circle5 li figure { width: 48%; margin: 0 auto 1vw;}
#top_reason2 .circle5 li .tts01{ background:#fff;}
#top_reason2 .circle5 li .tts01 .box-title {margin: 0 0 1.8vw; font-weight: bold;font-size: 1.2em;}
#top_reason2 .circle5 li .tts01 .box-title span{ display: block; color: #D37274; margin: 0 0 0.5vw; font-size: .9em;font-weight: bold;}	
#top_reason2 .circle5 li .tts01 .box-title span:before {font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f303"; margin-right: 1%;}
#top_reason2 .circle5 li .tts01 p {margin: 0; padding: 0;}	
/* その他、システム開発やカスタマイズなど、様々なご要望に柔軟にお答えできます！ご希望やご要望、なんでもお気軽にご相談ください！ */		
#top_reason2 .concierge-right { width: 50%; position: relative;padding:0; margin:0 auto; display: flex;justify-content: center; align-content: center; box-sizing: border-box;}
#top_reason2 .concierge-right .text {position: relative; display: inline-block; margin: 1.5em 0 1.5em 15px; padding: 4% 4% 0; font-size: 1.2em; background:rgba(224, 76, 100,0.2);
border-radius: 10px; height: 8vw; box-sizing: border-box; }
#top_reason2 .concierge-right .text:before {content: ""; position: absolute; top: 50%; left: 100%; margin-top: -15px;border: 15px solid transparent;border-left: 15px solid rgba(224, 76, 100,0.2);}
#top_reason2 .concierge-right .text p {margin: 0; padding: 0;}
/*バナー*/	
.top_banner{ margin-bottom: 0 !important; padding: 4vw 0 1vw;}	
.top_banner ul{ margin: 0 0 1%;}
/*カスタマイズOK!選べるサイト制作プラン*/
/*#top_plan{background: #f9f9f9; margin: 0 0 2vw;}	*/
#top_plan{background-color: rgba(244,244,244,0.5); margin: 0 0 2vw;}
#top_plan .plan01{ margin: 0 0 2vw;}
#top_plan .plan01 li{ padding: 2% 4% 4%; justify-content: center; align-items: center; width: calc(88%/1); background: #fff; box-shadow: 2px 2px 4px #ccc; text-align: center; margin: 0 auto 2%;}
#top_plan .plan01 li.plan_1{ background: #7f94dc;}
#top_plan .plan01 li.plan_2{ background: #5db0d7;}
#top_plan .plan01 li.plan_3{ background: #5bc881;}
#top_plan .plan01 li.plan_4{ background: #dbc27a;}
#top_plan .plan01 li.plan_5{ background: #e18895;}
#top_plan .plan01 li h5{position: relative;padding: 0.25em 0.5em;color: #fff;font-size: 1em; ont-weight: normal;}
#top_plan .plan01 li h5 strong{font-size: 1.25em; font-weight: 600;}
#top_plan .plan01 li.plan_1 h5:before {font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f06c"; margin-right: 2%;}
#top_plan .plan01 li.plan_2 h5:before {font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f0e8"; margin-right: 2%;}
#top_plan .plan01 li.plan_3 h5:before {font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f005"; margin-right: 2%;}
#top_plan .plan01 li.plan_4 h5:before {font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f1c0"; margin-right: 2%;}
#top_plan .plan01 li.plan_5 h5:before {font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f07a"; margin-right: 2%;}
#top_plan .plan01 li .price01{ display: block; padding: 2% 1%; border-radius: 40px; background:#fff; text-align:center;}
#top_plan .plan01 li .price01 strong{ font-size: 1.4em; font-style: italic; font-weight: bold; margin: 0 2%;}
#top_plan .plan01 li .note{ display: block; padding: 0 1%; color: #fff;}
#top_plan .plan01 li .note span{ display: block;}
#top_plan .plan01 li .note span:before {font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f14a"; margin-right: 1%;}
.text{ margin: 0 0 2vw;}
#top_plan .plan01 li .note2{ text-align: center; color: #fff;}	
#top_plan .plan01 li .note2 dt{ font-size: .8rem; color: #EBEBEB;margin-top: .5rem;}
#top_plan .plan01 li .note2 dd{ font-weight: 600; }
#top_plan .plan01 li.plan_5 .button{border: none; width: 100%;}
#top_plan .plan01 li.plan_5 .button a{ color: #fff; display: inline-block; line-height: 1; padding: 3%; text-align: center; background-color: #ed445d; width: 100%; border-radius: 4px; cursor: pointer; font-size: 90%;}
#top_plan .plan01 li.plan_5 .button a:hover{ background-color: #e26376;}
#top_plan .plan01 li.plan_5 .button a:after {font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f105"; margin-right: 1%; position: relative; right: -12px;}
#top_plan .customimg{ width: 90%; margin: 5% auto;}
.column2 .column2_inner{ width: 94%; margin: 4vw auto;}
.column2 .column2_inner table{ width: 100%;}	
/*Websサイト制作実績*/
#top_works{ padding-bottom: 4vw;}
#top_works .carousel{ width: 80%; margin: 0 auto;}
/*制作の流れ*/
#top_flow{background: #f9f9f9; margin-bottom: 0 !important; padding-bottom: 4vw;}	
#top_flow .flow {list-style:  none;padding:  0;width: 94%;margin: 0 auto;}
#top_flow .flow li {display:  inline-block;padding:8% 0.6%;border-radius:  6px;position:  relative;width: calc(96%/2);margin: 0 0 4%;border: 1px solid #20B485;box-shadow: 2px 2px 4px #ccc;background: rgba(252, 240, 228, 0.5);text-align: center;}
#top_flow .flow li h4{ font-size: 0.9em;}
#top_flow .flow li p{ font-size: .8em;text-align: left;padding-left:4%}
#top_flow .flow li span{ display: block; position: absolute; top: -10px; left: -10px; border-bottom: 1px solid #fff; margin: 0 0 1vw; font-size: 1em; background: #fff; border-radius: 50%; color: #fff; width: 40px; height: 40px; line-height: 40px; background-color:#20B485; font-weight: 900; text-align: center;}
/*お問い合わせフォーム*/	
#top_contact{ margin-bottom: 10vw !important;}
/*会社概要*/	
#top_company{ background: #f9f9f9; margin-bottom: 0 !important;}	
/* --------------------------------------------------
	ページ共通
-------------------------------------------------- */
#contents,#contents02 {margin:0;}
#contents > section {margin-bottom:12.125vw;}
#contents02 > section {margin-bottom:12.125vw;}
/* 見出し  */
#contents .page_caption,#contents02 .page_caption{font-size:1.4em; font-weight: bold; text-align: center; line-height: 2em; padding: 3.6vw 0; font-family:“ヒラギノ明朝 ProN W3”, “Hiragino Mincho ProN”, “游明朝”, YuMincho, "Sawarabi Mincho", “ＭＳ Ｐ明朝”, “MS PMincho”, serif;}
/* ページ見出し h2 */
.title01{position: relative;margin:4vw 0 4.6vw;text-align: center;font-size: 1.6em;color: #2b2d42;}
.title01:before{content: '';position: absolute;bottom: -2vw;display: inline-block;width: 80px;height: 2px;left: 50%;-moz-transform: translateX(-50%);-webkit-transform: translateX(-50%);-ms-transform: translateX(-50%);transform: translateX(-50%);background-color: #999;border-radius: 1px;}
/* ページ見出し h3 */
.title02{position: relative;display: block; padding: 0 2.5em; margin:4vw auto 4.6vw;text-align: center;font-size: 1.4em;color: #2b2d42; width: 90%;}
.title02:before, .title02:after{content: '';position: absolute;top: 50%;display: inline-block;width: 15%;height: 1px;background-color: #00bfa5;}
.title02:before, .title02:before {left:0;}
.title02:after, .title02:after {right: 0;}
/* ページ見出し h3 ver.2 */
.title03{position: relative;display: block; margin:4vw 0 2vw; text-align: center; font-size: 2em; color: #2b2d42; width: 100%;}
/* ページ見出し 上ボーダー */
.ttl04{display: table;text-align: center;margin: 0 auto 3vw;padding: 4vw 0 1vw 0;font-size:1.6em;letter-spacing: 0.13em;line-height: 1.4em;}
.ttl04 .sec01:before{ display: block; font-size: 100%; margin-bottom:6%; font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f0eb"; color:#FF886D;}
.ttl04 .sec02:before{ display: block; font-size: 100%; margin-bottom:2%; font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f080"; color:#f7dd65;}
.ttl04 .sec03:before{ display: block; font-size: 110%; margin-bottom:3%; font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f075"; color:#db6081;}
.ttl04 .sec04:before{ display: block; font-size: 100%; margin-bottom:4%; font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f085"; color:#39b275;}
.ttl04 .sec05:before{ display: block; font-size: 100%; margin-bottom:6%; font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f1fc"; color:#db6081;}
.ttl04 .sec06:before{ display: block; font-size: 110%; margin-bottom:6%; font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f1da"; color:#74BED8;}
.ttl04 .sec07:before{ display: block; font-size: 100%; margin-bottom:4%; font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f1d8"; color:#00b7d8;}
.ttl04 .sec08:before{ display: block; font-size: 100%; margin-bottom:20%; font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f1ad"; color:#db6081;}
.ttl04 span {display: block; text-align: center; line-height: 1em; padding: 1% 0 4%; font-style: normal; font-size: 0.9rem; color: #144584;}
/* ページ見出し h4 */
.title04{ padding: 0.5em;background:#F2F4F6;border-bottom: solid 3px #265BB1; margin: 0 0 1.2vw; font-size: 1.2em;}
/* ページ見出し h5 */
.title05{ width: 100%; font-size: 1.1em;}
.title05:before{ content: '●'; color:#73C2B5; position:relative; margin: 0 10px 0 0; font-size: 80%;}
#contents .page_caption2,#contents02 .page_caption2{font-size:1em; font-weight: bold; text-align: center; line-height: 1.8em; padding: 3.6vw 0; font-family:“ヒラギノ明朝 ProN W3”, “Hiragino Mincho ProN”, “游明朝”, YuMincho, "Sawarabi Mincho", “ＭＳ Ｐ明朝”, “MS PMincho”, serif;}
/* ページ見出し */
.lower_ttl{ margin: 0 2.6vw;}
/*波線*/
.stripe{ position: relative;padding: 0.3em;}
.stripe:after {content: '';position: absolute;left: 0;bottom: 0;width: 100%;height: 7px;background: repeating-linear-gradient(-45deg, #D6E6EB, #D6E6EB 2px, white 2px, white 4px);}
/*マーカー*/
.marker{ background:linear-gradient(transparent 75%, #ffc0cb 75%); font-weight: bold;}
/*リード文*/
.lead01 {width: 96%; line-height: 1.6; padding:0.25em 1em; display: block; text-align:center; margin: 0 auto 4vw; }
.lead02 {text-align: center; margin: 0 auto 2vw; color:#435B96; font-size: 0.9em; }
.lead03 {width: 96%; line-height: 1.6; padding:0.25em 1em; display: block; text-align:left; margin: 0 auto 4vw; }
.lead04 {width: 96%; line-height: 1.6; padding:0.25em 1em; display: block; text-align:left; margin: 0 auto 4vw; }

/*スクロールフェードイン*/
.fade_off {opacity: 0;-webkit-transition: all 1s;-moz-transition: all 1s;-o-transition: all 1s;-ms-transition: all 1s;transition: all 1s;}
.fade_on {opacity: 1;}
/*ふわふわ*/
.floating {-webkit-animation:floating 0.8s infinite linear alternate;animation:floating 0.8s infinite linear alternate;}

@-webkit-keyframes floating {
0% {-webkit-transform:translate(0, 0) rotate(-5deg);}
50% {-webkit-transform:translate(0, -5px) rotate(0deg);}
100% {-webkit-transform:translate(0, 0)rotate(5deg);}
}

@keyframes floating {
0% {transform:translate(0, 0) rotate(-5deg);}
50% {transform:translate(0, -5px) rotate(0deg);}
100% {transform:translate(0, 0)rotate(5deg);}
}

/*バウンス矢印*/
.arrowBounce {animation: bounce 2s infinite;color: #5778F3;position: relative;}
.arrowBounce::after {
	display: block; font-size: 100%; font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f107"; color:#fff;
}
@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
    40% {transform: translateY(-30px);}
    60% {transform: translateY(-15px);}
}

/*pulse*/
.pulse {
  animation: pulse 2s infinite;
}
@keyframes pulse {
  0% {transform: scale3d(1, 1, 1);}
  50%{transform: scale3d(1.1, 1.1, 1.1);}
  100% {transform: scale3d(1, 1, 1);}
}
/* --------------------------------------------------
	 table
-------------------------------------------------- */
/*グレー＋白 center*/
.type3 { width: 100%; border-collapse:  collapse;}
.type3 tr:nth-child(odd) {background-color:#ECECEC;}
.type3 th,.type3 td {padding: 6px 10px; text-align: center;}

/*グレー＋白 center 50%/50%*/
.type3_2 { width: 100%; border-collapse:  collapse; margin: 0 0 4vw}
.type3_2 tr:nth-child(odd) {background-color:#ECECEC;}
.type3_2 th,.type3_2 td { width: 50%; padding: 6px 10px; text-align: center;}

/*グレー＋白 center 50%/50%*/
.type3_3 { width: 100%; border-collapse:  collapse; margin: 0 0 4vw}
.type3_3 tr:nth-child(odd) {background-color:#E7F6FC;}
.type3_3 th,.type3_3 td { width: auto; padding: 6px 10px; text-align: left;}
/*線＋白*/
.type4 {width: 94%;border: none;border-top: solid 2px #666;border-collapse: separate;border-spacing: 0 10px;margin: 0 auto;}
.type4 tr { padding: 1% 0;}
.type4 th {display: block; vertical-align: middle; margin: 0;text-align: center;color: #333;font-weight: bold;padding: 1%;border-bottom: solid 1px #666; font-size: 90%;}
.type4 td{display: block; margin: 0;border: none;text-align: left;vertical-align: middle;overflow: hidden;padding: 2%; font-size: 88%;}
.type4 th.vtop {vertical-align:top;}
/*比較表*/
.type5{border-collapse: collapse;border-spacing: 0;table-layout: fixed;width: 94%; border-left:solid 1px #ddd; margin: 0 auto;}
.type5 tr:last-child{border-bottom:solid 1px #ddd;}
.type5 th{text-align: center;padding: 7px 0;border:solid 1px #ddd;background:#E9E9E9; font-size: 80%;}
.type5 th:nth-child(3){background-color:#f5b932;color: white;}
.type5 td{text-align: center;padding: 7px 0;border:solid 1px #ddd;}
.type5 .popular{width: auto;}
.type5 th.popular{position: relative;}
.type5 th.popular span.inner{position: absolute;color:white;background-color: #f34955;left: 0;bottom: 0;display: block;width: 100%;padding: 10px 0;}
.type5 td.td3{ font-weight: bold; font-size: 120%; background: #F8EEEF;}
.type5 th.th4 img{ width: 25% !important; height: auto;}
/* --------------------------------------------------
	 footer ボタンボタン
-------------------------------------------------- */
.inquiry{ position: fixed; bottom: 0; width: 100%;background: rgba(0, 46, 91,0.7); z-index: 10; box-shadow: 0 -1px 0 rgba(204, 204, 204,0.3)}
.inquiry p{ color: #fff; text-align: center; padding: 2% 0 0; font-size: 110%; font-weight: 900; margin-bottom: 1%;}
.inquiry ul{ /*padding:2.6% 1.2% 3.6%;*/ padding:0 1.2% 3.6%;}
.inquiry li{ text-align: center; display: flex; align-items: center; justify-content: center; line-height: 1; flex: 1;position: relative;background-image: linear-gradient(#eaeaea 0%, #c6c6c6 100%);box-shadow: inset 0 2px 0 rgba(255,255,255,0.5), 0 2px 2px rgba(0, 0, 0, 0.19);color: #a5a5a5;font-size: 90%;text-decoration: none;font-weight: bold;text-shadow: 1px 1px 1px rgba(255, 255, 255, 1);
adding: 2vw 0;border-radius: 4px;margin: 0 1%;}
.inquiry li:active{-webkit-transform: translateY(2px);transform: translateY(2px);box-shadow: 0 0 1px rgba(0, 0, 0, 0.15);background-image: linear-gradient(#f2f2f2 0%, #e2e2e2 100%);}
.inquiry li a{ display: block; width: 100%; font-size: 90%; padding: 4% 1% 4%; color:#666;}
.inquiry li a.form01:before{ display: block; font-size: 200%; margin-bottom:6%; font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f0e0"; color:#39b275;}
.inquiry li a.mail01:before{ display: block; font-size: 200%; margin-bottom:6%; font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f1d8"; color:#CB3868;}
.inquiry li a.tel01:before{ display: block; font-size: 200%; margin-bottom:6%; font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f3cd"; color:#26969F;}
#myradio1 .icheckbox_line-green, #myradio1 .iradio_line-green{background:#fd7c50;}
/* --------------------------------------------------
	 768px〜　タブレット
-------------------------------------------------- */
@media print, screen and (min-width : 768px) {	
html {font-size:15px;}
/* BODY */
body {padding-top:0;}
body.fixing-body {position:static; height:auto; top:auto !important;}
body.is-fixed {}
body#home {}
/* セクション */
section .inner {max-width:1200px; padding:0 50px; margin:0 auto;}
section .inner2 {width:100%; padding:0 50px; margin:0 auto;}
section .inner3 {max-width:1120px; padding:0 50px; margin:0 auto;}	
/* --------------------------------------------------
	共通
-------------------------------------------------- */
a:hover {color:#bbb;}
a:hover img {opacity: 0.75;	filter: alpha(opacity=60); transition: all 0.25s ease;}
.sp_only {display:none !important;}
.pc_only {display:block !important;}
.pc_only.flex {display:-webkit-flex !important; display:flex !important;}
.pc_only_br {display:inline !important;}
/* パンクズリスト */
#breadcrumb a:hover {color:#06b3aa;}
#breadcrumb li {font-size:0.875em;}
/* セクション見出し＆ページタイトル */
#page_ttl,.sec_ttl {margin-bottom:30px;}
#page_ttl:before,.sec_ttl:before {top:1.25em;left:14%;}
#page_ttl:after,.sec_ttl:after {right:14%;}	
#page_ttl h2,.sec_ttl h2 {font-size:1.75em;}
#page_ttl h1,.sec_ttl h1 {font-size:1.1em;}	
/* テーブル1 */
.tbl01 {border:none;}
.tbl01 tr {display:table-row; padding:0; border:none;}
.tbl01 th,.tbl01 td {display:table-cell; padding:1em; border:1px solid #ccc; vertical-align:top;}
.tbl01 th {white-space:nowrap;}
.tbl01 td {width:100%;}
/* ページャー */
.pager li a:hover { background-color:#ccc; color:#fff;}
/* dtをfloat leftする */
dl.dt_float:after {content:""; clear:both; display:block;}
dl.dt_float dt {clear:both; float:left;}
/* dtをfloat left したときの dd のパディングレフト */
.pdl5 dd {padding-left:5em;}
.pdl6 dd {padding-left:6em;}
.pdl7 dd {padding-left:7em;}
.pdl8 dd {padding-left:8em;}
.pdl9 dd {padding-left:9em;}
.pdl10 dd {padding-left:10em;}
.pdl11 dd {padding-left:11em;}
.pdl12 dd {padding-left:12em;}
.pdl13 dd {padding-left:13em;}
.pdl14 dd {padding-left:14em;}
.pdl15 dd {padding-left:15em;}
	
.btn20 {padding:0.5vw 5.5vw; margin: 1vw auto 1vw; font-size: 0.9em;}
/*iframe*/
iframe{ width: 100%; height: 30vw;}
/*紺背景＋白字 → 紺の枠＋白背景アルファ0.3*/
.btn10_2{padding:0.5vw 5.5vw;}
.btn1{ width: 50%; position: relative; margin: 4vw auto 0;}
.btn1 a{padding: 6% 0; font-size: 120%; font-weight: 700;	background: -moz-linear-gradient(right, #14a891, #4bd6c1);background: -webkit-linear-gradient(right, #14a891, #4bd6c1);background: linear-gradient(to right, #14a891, #4bd6c1);position: relative;color: #fff;border-radius: 50px;cursor: pointer;display: block;box-shadow: 3px 3px 4px rgba(0,0,0,0.1);text-align: center;}
.btn1 a:before{ 
font-size: 180%; position:absolute; top: 25%; left: 6%; font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f1d8"; margin-right:1%;}
.btn1 a:hover{background: -moz-linear-gradient(right, #4bd6c1, #14a891);background: -webkit-linear-gradient(right, #4bd6c1, #14a891);background: linear-gradient(to right, #4bd6c1, #14a891);}
/* --------------------------------------------------
	スクロールでGナビフェードイン
-------------------------------------------------- */
.fadeInDown {-webkit-animation-fill-mode:both;-ms-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:1s;-ms-animation-duration:1s;animation-duration:1s;-webkit-animation-name: fadeInDown;animation-name: fadeInDown;visibility: visible !important;}
@-webkit-keyframes fadeInDown {
 0% { opacity: 0; -webkit-transform: translateY(-20px); }
 100% { opacity: 1; -webkit-transform: translateY(0); }
}
@keyframes fadeInDown {
 0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); }
 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}
/* --------------------------------------------------
	固定ヘッダ＋Gナビ
-------------------------------------------------- */
#fixed_box {height:auto; position:absolute;}
#fixed_box .inner {max-width:1000px; margin:0 auto; padding:0 20px;}
#fixed_box .inner_max {max-width:100%; margin:0 auto; padding:10px 20px;}	
/* --------------------------------------------------
	ヘッダ
-------------------------------------------------- */
#header {height:auto; position:static; margin-bottom:30px;}
.is-fixed #header {display:none;}

/* サブヘッダー */
#sub_head {margin:40px 20px; padding-bottom:15px;}
#sub_head h1 {width:300px;}
#sub_head li{ margin: 0 2vw 0 0; width: 124px; letter-spacing: 0.1em; font-weight: bold;}	
#sub_head li:before {content:'';display: inline-block;margin:0 0.5em; width: 18px; height: 18px; background-image:url(../images/icon_01.png); background-repeat: no-repeat;background-size: contain;vertical-align: middle;}
#sub_head li span{ display: block; font-size: .8em; text-align: center; padding: 4px 0; font-style: normal; font-weight: normal;}
/* --------------------------------------------------
	Gナビ
-------------------------------------------------- */
#g_navi {display:none; position:static; height:auto; padding:0; margin-bottom:25px; background-color:rgba(255,255,255,0.7);}
#g_navi .layer {display:none;}
#g_navi nav{ width: auto;}
#g_navi h1{display: block;width:260px;margin: 0; position: relative;top: 7px; left: 20px;}	
#g_navi ul  {max-width:1000px; margin:0 auto; padding:0 20px; box-shadow:none;display:-webkit-flex; display:flex; -webkit-justify-content: space-between; justify-content:space-between;position:relative; z-index:99;}
#g_navi li { display: inline-block; width: auto; border:none !important; font-size:0.9em;border-bottom:1px solid #ddd; font-size:1.1em; text-align:center; font-style: italic;}
#g_navi li a {padding:0; display: inline-block;}
#g_navi li em {display:block; font-size:1.455em; margin-bottom:0.5em;}
.is-fixed #g_navi {display: block; position:fixed; top:0; left:0; margin-bottom:0; box-shadow: 0 5px 5px 0 rgba(0,0,0,0.05);}
.is-fixed #g_navi li.pc_only {display:block !important; width:80px;}
.is-fixed #g_navi li {padding:5px;}
.is-fixed #g_navi li:before {content:'';display: inline-block;margin:0 0.5em; width: 18px; height: 18px; background-image:url(../images/icon_01.png); background-repeat: no-repeat;background-size: contain;vertical-align: middle;}
/* --------------------------------------------------
	ページトップ
-------------------------------------------------- */
#backToTop {right:30px; bottom:30px; width:78px; height:auto;}
#backToTop:hover {opacity:0.75;}
/* --------------------------------------------------
	フッター
-------------------------------------------------- */
#footer {padding:20px 0 30px;}	
/* フッタナビ共通  */
#footer_navi {display:block; max-width:1000px; margin:0 auto; padding:0 20px 40px;}
#footer_navi:after {content: ""; clear: both; display: block;}
#footer_navi > div {width:33%; float:left;}
#footer_navi .about {margin:0 5%; text-align-last: right;}
#footer_navi h2:before,#footer_navi h3:before {display:none;}
#footer_navi .about, #footer_navi .etc{ width: 28%;}	
#footer_navi .location li {font-size:0.875em;}
#footer_navi .location li:before {content:"・";}
#footer_navi .location h3{font-size:0.875em;}
#footer_navi .etc {text-align-last: right;}
#footer_navi .etc li {display:block;}
#footer_navi .etc li:nth-child(odd) {margin-right:0;}
#footer_navi .etc li:before {display:none;}
#footer .copyright{ font-size: 0.9em; margin: 2vw 0 0;}	
/* --------------------------------------------------
	トップページ
-------------------------------------------------- */
#top_contents {margin:0;}
#top_contents > section {/*margin:10vw auto;*/ padding: 0 0 4vw;}
/* メインビジュアル */
#top_mv {width:100%; height: auto; margin: 0 auto !important; position: relative; padding: 8vw 0 0 !important; background-color: rgba(254, 245, 239, 0.3); background-blend-mode:lighten;}/*イメージのコントラスト調整*/
#top_mv .lead {width:90%; padding:0 0 8.75em; margin: 8vw auto 0; font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;font-weight: 700;}
#top_mv .lead h2 {line-height: 380%; margin-bottom: 0; text-shadow:3px 2px 0 rgba(255,255,255,0.9); text-align: center;}
#top_mv .lead h2 span{ display: block; width: 100%;}
#top_mv .lead h2 span.t01{ font-size:2.6em;}
#top_mv .lead h2 span.t02{ font-size:2.8em; /*justify-content: flex-start;*/}
#top_mv .lead h2 span.t03{ font-size:2.6em;}	
#top_mv .lead p {font-size:1.2em; font-style: italic; margin: 1.2vw 0;}	
/* メインビジュアル背景1 */
#top_mv.bg_b1 {background-image: url(../img/mvpc_03.png); background-size: cover; background-repeat: no-repeat; background-position: top;}
#top_mv.bg_b2 {background-image: url(../img/mvpc_04.png); background-size: 58%; background-repeat: repeat-x; background-position: center;}
#top_mv.bg_b3 {background-image: url(../img/mvpc_05.png); background-size: cover; background-repeat: no-repeat; background-position: center;}
#top_mv.bg_b4 {background-image: url(../img/mvpc_06.png); background-size: cover; background-repeat: no-repeat; background-position: center;}
#top_mv.bg_b5 {background-image: url(../img/mvpc_07.png); background-size: cover; background-repeat: no-repeat; background-position: center;}
#top_mv.bg_b6 {background-image: url(../img/mvpc_08.png); background-size: cover; background-repeat: no-repeat; background-position: top;}
#top_mv.bg_b7 {background-image: url(../img/mvpc_09.png); background-size: cover; background-repeat: no-repeat; background-position: center;}
#top_mv.bg_b8 {background-image: url(../img/mvpc_10.png); background-size: cover; background-repeat: no-repeat; background-position: center;}
#top_mv.bg_b9 {background-image: url(../img/mvpc_11.png); background-size: 28%; background-repeat: repeat-x; background-position: left 58% top 90%;}
#top_mv.bg_b10 {background-image: url(../img/mvpc_12.png); background-size: 62%; background-repeat: repeat-x; background-position: center;}
/* メインビジュアル背景2 */
#top_mv .lead.bg_a1,#top_mv .lead.bg_a2,#top_mv .lead.bg_a3,#top_mv .lead.bg_a4,#top_mv .lead.bg_a5,
#top_mv .lead.bg_a6,#top_mv .lead.bg_a7,#top_mv .lead.bg_a8,#top_mv .lead.bg_a9,#top_mv .lead.bg_a10 {background:none;}
/* 弊社Webディレクターがお客様のWebサイトのコンシェルジュです */	
.concierge { width: 100%; height: 28vw; position: relative; padding:4%; margin:0 auto; background-image: url(../img/concierge_bg01.png); background-size: cover;}
.concierge .c_inner{ width: 60%; position: relative;}
.concierge .text { position: relative; width: 100%; color:#FCF0E4; font-size: 1.9rem; font-weight: 700; line-height: 1.8;}
.concierge .text span { font-size: 1.2rem; }
.concierge .text a{ color: #DD5C5E;}
.concierge2 { width: 100%; height: auto; position: relative; padding:2% 4% 1%; margin:0 auto; background-image: url(../img/concierge_bg01_6.png); background-size:  cover;}
.concierge2 .c_inner{ width: 60%; position: relative;}
.concierge2 .text { position: relative; width: 100%; color:#FCF0E4; font-size: 1.9rem; font-weight: 700; line-height: 1.8; margin-bottom: 2vw;}
.concierge2 .text span { font-size: 1.2rem; }
.concierge2 .text a{ color: #DD5C5E;}
.inquiryarea {display: flex; flex-wrap: wrap;}
.inquiryarea li{ display: block; margin: 0 2% 2% 0; text-align: center;}
.inquiryarea li a{ display: block; color: #fcf0e4; border-radius: 50px; position: relative;}
.inquiryarea li.btn001,.inquiryarea li.btn002{ display: block; visibility: visible; width:36%; position: relative;}
.inquiryarea li.btn003,.inquiryarea li.btn004{ display: block; visibility: visible;}	
.inquiryarea li.btn001 a {padding: 8% 0 8% 6%; font-size: 100%; font-weight: 700;	background: -moz-linear-gradient(top, #3eb489, #5ec69d);background: -webkit-linear-gradient(top, #3eb489, #5ec69d);background: linear-gradient(to top, #3eb489, #5ec69d);text-shadow:1px 1px 2px rgba(0,0,0,0.3);	}
.inquiryarea li.btn001 a:before{ 
font-size: 160%; position:absolute; top: 25%; left: 6%; font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f1d8"; margin-right:1%;}
.inquiryarea li.btn002 a {padding: 8% 0 8% 6%; font-size: 96%; font-weight: 700;	background: -moz-linear-gradient(top, #ff6f77, #ff8896);background: -webkit-linear-gradient(top, #ff6f77, #ff8896);background: linear-gradient(to top, #ff6f77, #ff8896);
text-shadow:1px 1px 2px rgba(0,0,0,0.3);}
.inquiryarea li.btn002 a:before{font-size: 160%; position:absolute; top:25%; left: 8%; font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f0e0"; margin-right:1%;}
.inquiryarea li.btn003 {width:74%; border-radius: 10px;background:rgba(252, 240, 228,0.75); padding: 1%; color: #144584; font-size: 88%;}
.inquiryarea li.btn003:before{ position:absolute; left: 2%; font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f05a"; margin-right:1%; font-size: 200%;}
.inquiryarea li.btn004{ width:74%; position: relative; font-weight: normal;}
.inquiryarea li.btn004 a{padding: 2% 0; font-size: 96%; font-weight:normal;background: -moz-linear-gradient(top, #ef9a3c, #f3b15b);background: -webkit-linear-gradient(top, #ef9a3c, #f3b15b);background: linear-gradient(to top, #ef9a3c, #f3b15b);text-shadow:1px 1px 2px rgba(0,0,0,0.3);	}
.inquiryarea li.btn004 a span{ display: block; font-size: 140%; font-style: italic; font-weight: 700;}
.inquiryarea li.btn004 a:before{font-size: 190%; position:absolute; top:20%; left: 5%; font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f3cd"; margin-right:1%;}
/* メテオリレイがこの10年で培った5つのチカラ */
#top_mv2 { margin-bottom:0 !important; padding-bottom: 0 !important;}
#top_mv2 .strong_point ul {display: flex;justify-content: center; align-content: center; flex-wrap: wrap; width: 80%; margin: 0 auto;}	
#top_mv2 .strong_point li {position: relative;display:block; width: calc(90%/3); margin:0 auto 5%; font-size: 1em;}
#top_mv2 .strong_point li p {margin: 0; padding: 0;}
#top_mv2 .strong_point li strong{ font-weight: bold; font-size: 1.6em;}	
#top_mv2 .strong_point li strong:before{font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f292"; margin-right: 2%; font-size: 80%;}
#top_mv2 .strong_point li .icoimg01 { background: #fff; padding: 13%; border-radius: 50%; width: 180px; height: 180px; margin: 0 auto 5%;}
#top_mv2 .strong_point li .icoimg01 img { width: 100%; height: auto;}
#top_mv2 .strong_point li.s01 strong{ background:linear-gradient(transparent 75%, #7fff7f 75%);font-weight:bold; }	
#top_mv2 .strong_point li.s02 strong{ background:linear-gradient(transparent 75%, #ffdc00 75%);font-weight:bold; }	
#top_mv2 .strong_point li.s03 strong{ background:linear-gradient(transparent 75%, #9eceff 75%);font-weight:bold; }	
#top_mv2 .strong_point li.s04 strong{ background: linear-gradient(transparent 75%, #FEA38D 75%);font-weight: bold;}	
#top_mv2 .strong_point li.s05 strong{ background:linear-gradient(transparent 75%, #C49FF6 75%);font-weight:bold;}
#top_mv2 .strong_point li.s06 strong{ background:linear-gradient(transparent 75%, #B5E61D 75%);font-weight:bold;}		
/*弊社サイト制作のコスパが良い理由*/
#top_reason { margin-bottom:0 !important;}
#top_reason .catch	{ text-align: center; margin: 0 0 3%;}
#top_reason img{ width: auto; height: auto;}
/*Wordpress制作に弊社が選ばれる理由*/	
#top_reason2{background-color: rgba(244,244,244,0.5);padding: 4vw 0; margin-bottom: 0 !important;}
#top_reason2 .circle5 {margin-top: 3vw;}	
#top_reason2 .circle5 li {display: flex; margin: 0 !important; background: transparent !important; box-shadow:none; width: 100%; padding:4% 0;}
#top_reason2 .circle5 li:last-child {margin-bottom: 0;}	
#top_reason2 .circle5 li figure { width: 32%; margin-top: -40px; margin-bottom: 40px; box-shadow: 2px 2px 0 #ccc;}
#top_reason2 .circle5 li .tts01{ width: calc(100% - 32%); background:#fff; padding: 2% 3% 1%; box-shadow: 2px 2px 0 #ccc;}
#top_reason2 .circle5 li .tts01 .box-title {margin: 0 0 1.8vw;font-size: 1.4em;font-weight: bold;}
#top_reason2 .circle5 li .tts01 .box-title span{ display: block; color: #D37274; margin: 0 0 0.5vw; font-size: .9em;font-weight: bold;}	
#top_reason2 .circle5 li .tts01 .box-title span:before {font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f303"; margin-right: 1%;}
#top_reason2 .circle5 li .tts01 p {margin: 0; padding: 0;}	
/* その他、システム開発やカスタマイズなど、様々なご要望に柔軟にお答えできます！ご希望やご要望、なんでもお気軽にご相談ください！ */		
#top_reason2 .concierge-right { width: 50%; position: relative;padding:0; margin:0 auto; display: flex;justify-content: center; align-content: center; box-sizing: border-box;}
#top_reason2 .concierge-right .text {position: relative;display: inline-block;margin: 1.5em 0 1.5em 15px;padding: 4% 4% 0;font-size: 1.2em;background:rgba(224, 76, 100,0.2);border-radius: 10px;height: 8vw;box-sizing: border-box;}
#top_reason2 .concierge-right .text:before {content: "";position: absolute;top: 50%;left: 100%;margin-top: -15px;border: 15px solid transparent;border-left: 15px solid rgba(224, 76, 100,0.2);	}
#top_reason2 .concierge-right .text p {margin: 0;padding: 0;}
/*バナー*/	
.top_banner{ margin-bottom: 0 !important; padding: 4vw 0 1vw;}	
.top_banner ul{ margin: 0 0 1%;}
/*カスタマイズOK!選べるサイト制作プラン*/
/*#top_plan{background: #f9f9f9; margin-bottom: 0 !important;}	*/
#top_plan{background-color: rgba(244,244,244,0.5); margin-bottom: 0 !important;}		
#top_plan .plan01{ margin: 0 0 2vw;}
#top_plan .plan01 li{ padding: 2% 1% 0; justify-content: center; align-items: center; /*width: calc(98%/5);*/ background: #fff; box-shadow: 2px 2px 4px #ccc; text-align: center; flex: 1; margin: 0 0.2%;}
#top_plan .plan01 li.plan_1{ background: #7f94dc;}
#top_plan .plan01 li.plan_2{ background: #5db0d7;}
#top_plan .plan01 li.plan_3{ background: #5bc881;}
#top_plan .plan01 li.plan_4{ background: #dbc27a;}
#top_plan .plan01 li.plan_5{ background: #e18895;}
#top_plan .plan01 li h5{position: relative;padding: 0.25em 0;color: #fff;font-size: 1em; ont-weight: normal;}
#top_plan .plan01 li h5 strong{font-size: 1.25em; font-weight: 600;}
#top_plan .plan01 li.plan_1 h5:before {font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f06c"; margin-right: 2%;}
#top_plan .plan01 li.plan_2 h5:before {font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f0e8"; margin-right: 2%;}
#top_plan .plan01 li.plan_3 h5:before {font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f005"; margin-right: 2%;}
#top_plan .plan01 li.plan_4 h5:before {font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f1c0"; margin-right: 2%;}
#top_plan .plan01 li.plan_5 h5:before {font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f07a"; margin-right: 2%;}
#top_plan .plan01 li .price01{ display: block; padding: 4% 1%; border-radius: 40px; background:#fff; text-align:center;}
#top_plan .plan01 li .price01 strong{ font-size: 1.4em; font-style: italic; font-weight: bold; margin: 0 2%;}
#top_plan .plan01 li .note{ display: block; padding: 0 1%; color: #fff;}
#top_plan .plan01 li .note span{ display: block;}
#top_plan .plan01 li .note span:before {font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f14a"; margin-right: 1%;}
.text{ margin: 0 0 2vw;}
#top_plan .plan01 li .note2{ text-align: center; color: #fff;}	
#top_plan .plan01 li .note2 dt{ font-size: .8rem; color: #EBEBEB;margin-top: 1rem;}
#top_plan .plan01 li .note2 dd{ font-weight: 600; }
#top_plan .plan01 li.plan_5 .button{border: none; width: 100%;}
#top_plan .plan01 li.plan_5 .button a{ color: #fff; display: inline-block; line-height: 1; padding: 10%; text-align: center; background-color: #ed445d; width: 100%; border-radius: 8px; cursor: pointer;}
#top_plan .plan01 li.plan_5 .button a:hover{ background-color: #e26376;}
#top_plan .plan01 li.plan_5 .button a:after {font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f105"; margin-right: 1%; position: relative; right: -12px;}
#top_plan .customimg{ width: 84%; margin: 5% auto 0;}	
.column2 .column2_inner{ width: 48%;}	
.column2 .column2_inner table{ width: 100%;}	
/*Websサイト制作実績*/
#top_works .carousel{ width: 100%; margin: 4vw auto 0;}	
/*制作の流れ*/
#top_flow{background: #f9f9f9; margin-bottom: 0 !important;}
#top_flow .flow { list-style:  none; padding: 0;}
#top_flow .flow li {display: inline-block;padding:4% 0.6%;border-radius:  6px;font-size:1.4em;width: calc(94%/4);position: relative;border: 1px solid #20B485;box-shadow: 2px 2px 4px #ccc;background: rgba(252, 240, 228, 0.5);text-align: left;margin: 3vw auto 0;}
#top_flow .flow li h4{ font-size: 0.9em;text-align: center;}
#top_flow .flow li p{ font-size: .7em;}
#top_flow .flow li span{ display: block; position: absolute; top: -16px; left: -16px; border-bottom: 1px solid #fff; margin: 0 0 1vw; font-size: 1em; background: #fff; border-radius: 50%; color: #fff; width: 50px; height: 50px; line-height: 50px; background-color:#20B485; font-weight: 900; text-align: center;}
/*お問い合わせフォーム*/	
#top_contact{ margin-bottom: 0 !important;}
/*会社概要*/	
#top_company{background: #f9f9f9; margin-bottom: 0 !important;}
/* --------------------------------------------------
	ページ共通
-------------------------------------------------- */
#contents,#contents02 {margin:0;}
#contents > section {margin:8vw auto;}
#contents02 > section {margin:8vw auto;}
/* ページ見出し 上ボーダー */
.ttl04{display: table;text-align: center;margin: 0 auto 3vw;padding: 5.8vw 0 1vw 0;font-size:2.8em;letter-spacing: 0.13em;line-height: 1.4em;}
.ttl04 span {display: block;text-align: center;line-height: 1em;padding: 1% 0 6%;font-style: normal;font-size: 1.4rem;}
/* ページ見出し h3 */
.title02{position: relative;display: inline-block;padding: 0 2.5em;margin:4vw 0 4.6vw;text-align: center;font-size: 2.2em;color: #2b2d42; width: 100%;}
.title02:before, .title02:after{content: '';position: absolute;top: 50%;display: inline-block;width: 15%;height: 1px;background-color: #00bfa5;}
.title02:before, .title02:before {left:0;}
.title02:after, .title02:after {right: 0;}
/*リード文*/
.lead01 {width: 100%;position: relative;line-height: 1.6;padding:0.25em 1em;display: inline-block;top:0;margin: 0 0 1.4vw;text-align: center;font-size: 1.2em;}
.lead01:before, .lead01:after { position: absolute;top: 0;content:'';width: 8px;height: 100%;display: inline-block;}
.lead01:before {border-top: dotted 1px #535aaa;border-left: dotted 1px #535aaa;border-bottom: dotted 1px #535aaa;left: 0;}
.lead01:after {content: '';border-top: dotted 1px #535aaa;border-right: dotted 1px #535aaa;border-bottom: dotted 1px #535aaa;right: 0;}
.lead02 {text-align: center; margin: 0 auto 2vw; color:#435B96; font-size: 1.1em; }	
	
.lead03 {width: 100%;position: relative;line-height: 1.6;padding:0.25em 1em;display: inline-block;top:0;margin: 0 0 1.4vw;text-align: left;font-size: 1.2em;}
.lead03:before, .lead03:after { position: absolute;top: 0;content:'';width: 8px;height: 100%;display: inline-block;}
.lead03:before {border-top: dotted 1px #535aaa;border-left: dotted 1px #535aaa;border-bottom: dotted 1px #535aaa;left: 0;}
.lead03:after {content: '';border-top: dotted 1px #535aaa;border-right: dotted 1px #535aaa;border-bottom: dotted 1px #535aaa;right: 0;}
.lead04 {width: 100%;position: relative;line-height: 1.6;padding:0.25em 1em;display: inline-block;top:0;margin: 0 0 1.4vw;text-align: center;font-size: 1.2em;}
.lead04:before, .lead04:after { position: absolute;top: 0;content:'';width: 8px;height: 100%;display: inline-block;}
.lead04:before {border-top: dotted 1px #535aaa;border-left: dotted 1px #535aaa;border-bottom: dotted 1px #535aaa;left: 0;}
.lead04:after {content: '';border-top: dotted 1px #535aaa;border-right: dotted 1px #535aaa;border-bottom: dotted 1px #535aaa;right: 0;}
/* --------------------------------------------------
	 table
-------------------------------------------------- */
/*線＋白*/
.type4 {width: 100%;border: none;border-top: solid 2px #666;border-collapse: separate;border-spacing: 0 10px;margin: 0 0 4%;}
.type4 tr { padding: 1% 0;}
.type4 th { display: table-cell; vertical-align: middle;width: 30%;border-right: solid 1px #666;margin: 0;text-align: center;color: #333;font-weight: bold;padding: 1%;border-bottom: solid 1px #666;font-size: 16px;}
.type4 td{ display: table-cell; margin: 0;border: none;text-align: left;vertical-align: middle;overflow: hidden;padding: 1% 2%;}
.type4 th.vtop {vertical-align:top;}
/*比較表*/
.type5{border-collapse: collapse;border-spacing: 0;table-layout: fixed;width: 100%; border-left:solid 1px #ddd;}
.type5 tr:last-child{border-bottom:solid 1px #ddd;}
.type5 th{text-align: center;padding: 7px 0;border:solid 1px #ddd;background:#E9E9E9; font-size: 100%;}
.type5 th:nth-child(3){background-color:#f5b932;color: white;}
.type5 td{text-align: center;padding: 7px 0;border:solid 1px #ddd;}
.type5 .popular{width: 180px;}
.type5 th.popular{position: relative;}
.type5 th.popular span.no1{position: absolute;top: -10px;left:calc(50% - 30px);background: #bdcc28;width: 60px;font-size: 10px;border-radius: 15px;line-height: 1;padding: 5px;}
.type5 th.popular span.inner{position: absolute;color:white;background-color: #f34955;left: 0;bottom: 0;display: block;width: 180px;padding: 10px 0;}
/* --------------------------------------------------
	 984px〜　PC
-------------------------------------------------- */
@media print, screen and (min-width : 984px) {
/* ヘッダ */
#main_head {height:120px;}
#main_head .coupon {position:static; width:calc(100% - 634px); float:left; background:url(../images/bg_pattern05.png) repeat-x,url(../images/bg_pattern06.png) repeat-x left bottom,url(../images/bg_pattern07.png) repeat-y,url(../images/bg_pattern08.png) repeat-y right top,url(../images/bg_pattern01.png); background-size:auto,auto,auto,auto,12px 12px; line-height:1.35; padding:15px 20px; text-align:left;}
#main_head .coupon h2,#main_head .coupon p {display:block; margin:0;}
#main_head .coupon p strong {font-size:1.1em;}
#main_head .coupon p strong:after {content:url(../images/icon_free_postage.png); margin-left:5px;}
#main_head .coupon p.caution {display:block; margin:3px 0 0;}
#top_mv .lead {width:90%;margin: 4vw auto 0;}	

#top_mv .lead h2 span.t01{ font-size:2.8em;}
#top_mv .lead h2 span.t02{ font-size:3em; /*justify-content: flex-start;*/}
#top_mv .lead h2 span.t03{ font-size:2.8em;}	
}



