@charset "utf-8";
/* CSS Document */

.content { min-height:50vh;}

/* トップページparallax用 */
/*#mainimg01 { position:relative; width:100%; height:auto; min-height:100vh; margin:0; padding:0;
background-repeat:no-repeat, no-repeat;
background-image:url(../img/top/bg01-01.png), url(../img/top/bg01-02.jpg);
background-size:cover, cover;
background-position:center center, right center;
background-attachment:scroll, fixed;/}*/
#mainimg01 {
width:100vw;
height:100vh;
background-position:center center;
background-size:cover;
display:flex;
align-items:center;
justify-content:center;
background-attachment:fixed;/*画面からの相対位置（背景固定）*/}
#mainimg02 { position:relative; width:100%; height:auto; min-height:100vh; margin:0; padding:0;
background-repeat:no-repeat;
background-image:url(../img/top/block-bg02.jpg);/*背景画像*/
background-size:cover;/*背景サイズ*/
background-position:center center;
background-attachment:fixed;/*画面からの相対位置（背景固定）*/}
#mainimg03 { position:relative; width:100%; height:auto; min-height:100vh; margin:0; padding:0;
background-repeat:no-repeat;
background-image:url(../img/top/block-bg03.jpg);/*背景画像*/
background-size:cover;/*背景サイズ*/
background-position:center center;
background-attachment:fixed;/*画面からの相対位置（背景固定）*/}
@media all and (max-width:719px)
{
/*#mainimg01 {
background-image:url(../img/top/bg01-01_sp.png), url(../img/top/bg01-02_sp.jpg);
background-size:cover, cover;
background-position:center bottom, center center;
background-attachment:scroll, scroll;}*/
#mainimg01 {
background-image:url(../img/top/block-bg01.jpg);/*背景画像*/
background-size:cover;/*背景サイズ*/
background-position:center center;
background-attachment:scroll;/*画面からの相対位置（背景固定）*/}
#mainimg02 {
background-image:url(../img/top/block-bg02.jpg);/*背景画像*/
background-size:cover;/*背景サイズ*/
background-position:center center;
background-attachment:scroll;/*画面からの相対位置（背景固定）*/}
#mainimg03 {
background-image:url(../img/top/block-bg03.jpg);/*背景画像*/
background-size:cover;/*背景サイズ*/
background-position:center center;
background-attachment:scroll;/*画面からの相対位置（背景固定）*/}
}

#mainimg01 ul,
#mainimg02 ul,
#mainimg03 ul { width:100%; margin:0; padding:0; list-style:none; text-align:center !important; font-size:0; position:absolute; top:50%; left:50%; transform:translateY(-50%) translateX(-50%); -webkit-transform:translateY(-50%) translateX(-50%);}
#mainimg01 ul li,
#mainimg02 ul li,
#mainimg03 ul li { display:inline-block; vertical-align:middle; padding:0 5px; font-size:64px; line-height:1.2; color:#333333;
text-shadow:
1px 1px 5px #FFFFFF, -1px 1px 5px #FFFFFF,
1px -1px 5px #FFFFFF, -1px -1px 5px #FFFFFF,
2px 2px 5px #FFFFFF, -2px 2px 5px #FFFFFF,
2px -2px 5px #FFFFFF, -2px -2px 5px #FFFFFF;
}
#mainimg01 ul li span,
#mainimg02 ul li span,
#mainimg03 ul li span { display:inline-block;}
@media all and (max-width:719px)
{
#mainimg01 ul li,
#mainimg02 ul li,
#mainimg03 ul li { margin:0 auto; font-size:3.8rem;}
}

#mainimg01 ul li:nth-of-type(1) { margin:0; padding:8px 15px 3px; font-size:3.5vw; background-color:rgba(255,255,255,0.25);
-moz-border-radius: 15px;    /* 古いFirefox */
-webkit-border-radius: 15px; /* 古いSafari,Chrome */
border-radius: 15px;         /* CSS3 */}
#mainimg01 ul li:nth-of-type(2) { display:block; margin:15px 0 0;}
#mainimg01 ul li:nth-of-type(3) { margin:0; padding:8px 15px 3px; font-size:3.5vw; background-color:rgba(255,255,255,0.25);
-moz-border-radius: 15px;    /* 古いFirefox */
-webkit-border-radius: 15px; /* 古いSafari,Chrome */
border-radius: 15px;         /* CSS3 */}
#mainimg01 ul li:nth-of-type(3) strong { color:#EB3F40;}
#mainimg01 ul li img { width:80%; max-width:480px;}
@media all and (max-width:719px)
{
#mainimg01 ul li:nth-of-type(1) { padding:5px; font-size:5.0vw; font-weight:bold;
-moz-border-radius: 10px;    /* 古いFirefox */
-webkit-border-radius: 10px; /* 古いSafari,Chrome */
border-radius: 10px;         /* CSS3 */}
#mainimg01 ul li:nth-of-type(2) { margin:5px 0 0;}
#mainimg01 ul li:nth-of-type(3) { padding:5px; font-size:5.0vw;
-moz-border-radius: 10px;    /* 古いFirefox */
-webkit-border-radius: 10px; /* 古いSafari,Chrome */
border-radius: 10px;         /* CSS3 */}
#mainimg01 ul li span { display:block;}
}

#mainimg02 ul li { margin:0; padding:8px 0 3px 15px; text-align:center; font-size:3.0vw; line-height:1.4; background-color:rgba(255,255,255,0.25);
-moz-border-radius: 15px;    /* 古いFirefox */
-webkit-border-radius: 15px; /* 古いSafari,Chrome */
border-radius: 15px;         /* CSS3 */}
#mainimg02 ul li:nth-of-type(2) { padding-left:0; margin-top:5vh;}
@media all and (max-width:719px)
{
#mainimg02 ul li { padding:5px; font-size:5.0vw; font-weight:bold;
-moz-border-radius: 10px;    /* 古いFirefox */
-webkit-border-radius: 10px; /* 古いSafari,Chrome */
border-radius: 10px;         /* CSS3 */}
}

#mainimg03 ul li { margin:0; padding:8px 0 3px 15px; text-align:center; font-size:3.0vw; line-height:1.4; background-color:rgba(255,255,255,0.25);
-moz-border-radius: 15px;    /* 古いFirefox */
-webkit-border-radius: 15px; /* 古いSafari,Chrome */
border-radius: 15px;         /* CSS3 */}
#mainimg03 ul li:nth-of-type(2) { display:block; height:0; font-size:0; background-color:transparent;}
#mainimg03 ul li:nth-of-type(3) { padding-left:0; margin-top:1vh; background-color:rgba(0,0,0,0.65);}
#mainimg03 ul li:nth-of-type(3) a:hover { opacity:0.7;}
@media all and (max-width:719px)
{
#mainimg03 ul li { padding:5px; font-size:5.0vw; font-weight:bold;
-moz-border-radius: 10px;    /* 古いFirefox */
-webkit-border-radius: 10px; /* 古いSafari,Chrome */
border-radius: 10px;         /* CSS3 */}
#mainimg03 ul li:nth-of-type(3) img { width:60px;}
}

/*トップページparallax用･･･Safariだけに適用されるCSSハック*/
@media screen and (-webkit-min-device-pixel-ratio:0) and (min-width:720px) {
::i-block-chrome, #mainimg01 { height:auto; min-height:100%; background-attachment:scroll, scroll;}
::i-block-chrome, #mainimg02 { height:auto; min-height:100%; background-attachment:scroll, scroll;}
::i-block-chrome, #mainimg01 ul,
::i-block-chrome, #mainimg02 ul,
::i-block-chrome, #mainimg03 ul { display:block; position:relative; top:0; right:0; bottom:0; left:0; transform:translateY(0) translateX(0); -webkit-transform:translateY(0) translateX(0);}
::i-block-chrome, #mainimg01 ul li img { width:auto; height:100%;}
::i-block-chrome, #mainimg02 ul { padding:300px 0;}
::i-block-chrome, #mainimg02 ul li { width:40%; text-align:center;}
}

/*　*/
.btn-more { display:inline-block; margin:40px auto 0;}
.btn-more a { display:block; padding:14px 19px; border:#333333 1px solid; text-align:center; font-size:20px; color:#333333; background-color:#FFFDE8;
-moz-border-radius: 5px;    /* 古いFirefox */
-webkit-border-radius: 5px; /* 古いSafari,Chrome */
border-radius: 5px;         /* CSS3 */}
.btn-more a:hover { opacity:0.7; text-decoration:none;}
.btn-more a span { display:inline-block; margin:0 0 0 15px; font-size:18px;}
@media all and (max-width:719px)
{
.btn-more { display:block;}
.btn-more a { padding:14px 9px; font-size:1.8rem;}
.btn-more a span { margin:0 0 0 5px;}
}

/* トップページ･･･トップイメージ部装飾用 */
.topmain-bgtop { position:absolute; top:0; right:0; left:0; height:50px; background:url(../../img/com/topimg-curve.png) top center no-repeat; background-size:100% 100%;}
.topmain-bgbtm { position:absolute; right:0; bottom:0; left:0; height:120px; background:/*#EBF7D2*/ url(../../img/com/header-bg.png) bottom center repeat-x; background-size:270px 120px;}
.whatsnew { position:absolute; top:-20px; right:0; left:0; margin:0;}
.whatsnew a { display:inline-block; margin:0 0 0 2%; padding:25px 10px 10px; font-size:28px; color:#FFFFFF; background-color:#2BA31D;
-moz-border-radius: 10px;    /* 古いFirefox */
-webkit-border-radius: 10px; /* 古いSafari,Chrome */
border-radius: 10px;         /* CSS3 */}
.whatsnew a:hover { color:#FFFF66; background-color:#56D163;
-moz-border-radius: 10px;    /* 古いFirefox */
-webkit-border-radius: 10px; /* 古いSafari,Chrome */
border-radius: 10px;         /* CSS3 */}
.ellipse { position:absolute; display:table; width:250px; height:200px; margin:0; padding:0; text-align:center;}
.ellipse a { display:table-cell; vertical-align:middle; font-size:32px; color:#333333; line-height:1.2; background-color:rgba(255,255,255,0.6);
-moz-border-radius: 200px;    /* 古いFirefox */
-webkit-border-radius: 200px; /* 古いSafari,Chrome */
border-radius: 200px;         /* CSS3 */
text-shadow:
1px 1px 10px #FFFFFF, -1px 1px 10px #FFFFFF,
1px -1px 10px #FFFFFF, -1px -1px 10px #FFFFFF,
2px 2px 10px #FFFFFF, -2px 2px 10px #FFFFFF,
2px -2px 10px #FFFFFF, -2px -2px 10px #FFFFFF;}
.ellipse a span { display:block;}
.ellipse a:hover { color:#FFFFFF; text-decoration:none; background-color:#333333; text-shadow:none;}
.cth01 { top:50px; left:50%; margin-left:-125px;}
.cth02 { top:50%; left:30px; margin-top:-100px;}
.cth03 { top:50%; right:30px; margin-top:-100px;}
.cth04 { bottom:50px; left:50%; margin-left:-125px;}
@media all and (max-width:939px)
{
.whatsnew { text-align:center;}
.whatsnew a { margin:0 auto !important;}
.cth01 { top:50px; left:50px; margin-left:0;}
.cth02 { top:auto; bottom:50px; left:50px; margin-top:0;}
.cth03 { top:50px; right:50px; margin-top:0;}
.cth04 { bottom:50px; left:auto; right:50px; margin-left:0;}
}
@media all and (max-width:719px)
{
.whatsnew a { padding:25px 5px 5px; font-size:2.0rem;
-moz-border-radius: 5px;    /* 古いFirefox */
-webkit-border-radius: 5px; /* 古いSafari,Chrome */
border-radius: 5px;         /* CSS3 */}
.topmain-bgbtm { background-size:180px 80px;}
.ellipse { width:150px; height:120px;}
.ellipse a { font-size:2.0rem;}
}
@media all and (max-width:539px)
{
.cth01 { left:10px;}
.cth02 { left:10px;}
.cth03 { right:10px;}
.cth04 { right:10px;}
}

/* トップページ･･･コンテンツ用 */
#home > h2:nth-of-type(1),
#home h2.home-title { margin:80px 0 40px; padding:0 50px; text-align:center; font-size:32px;}
#home .topblock > div { display:inline-block; vertical-align:top; width:48%; text-align:center;}
#home .topblock > div.imgbox01 { margin-right:2%;}
#home .topblock > div.imgbox01 img { width:100%; height:auto;}
#home .topblock div h3,
#home .topblock div p { margin:0 0 20px; text-align:left; font-size:18px;}
#home .topblock div p span.kome { display:block; padding-left:1.0em; border-bottom:none; font-size:14px; text-indent: -1em;}
#home .topblock div p span.kome:before { display: inline; content: "※";}
#home .topblock div p.appli-exe { display:inline-block; padding:18px; border:#EB3F40 2px solid; text-align:left;
-moz-border-radius: 10px;    /* 古いFirefox */
-webkit-border-radius: 10px; /* 古いSafari,Chrome */
border-radius: 10px;         /* CSS3 */}
#home .topblock > div.imgbox02 { margin-left:2%;}
#home .topblock > div.imgbox02 img { width:100%; height:auto;}
#home .topblock > div.imgbox03 { margin-right:2%;}
#home .topblock > div.imgbox03 img { width:100%; height:auto;}
#home .noticeblock { height:300px; overflow-y:scroll; border:#999999 1px solid;}
#home .noticeblock dl { margin:0; padding:0; text-align:left;}
#home .noticeblock dl dt { float:left; width:100px; margin:3px 0 5px; padding:5px; text-align:center;}
#home .noticeblock dl dd { margin:0 0 5px; padding:5px 10px 5px 110px; border-bottom:#CCCCCC 1px dotted; font-size:16px;}
#home .noticeblock dl dd span { display:inline-block; vertical-align:baseline; margin:0 0 0 10px; font-size:14px;}
#home .noticeblock dl dd span a { display:block; padding:1px 5px; color:#FFFFFF; background-color:#947247;
-moz-border-radius: 2px;    /* 古いFirefox */
-webkit-border-radius: 2px; /* 古いSafari,Chrome */
border-radius: 2px;         /* CSS3 */}
@media all and (max-width:719px)
{
#home > h2:nth-of-type(1),
#home h2.home-title { margin:40px 0 20px; padding:0 15px; font-size:2.4rem;}
#home .topblock > div { display:block; width:auto;}
#home .topblock > div:nth-of-type(1) { margin-right:0;}
#home .topblock div:nth-of-type(2) { margin:20px 0 0;}
#home .topblock div h3,
#home .topblock div p { font-size:1.6rem;}
#home .topblock div p.kome { font-size:1.2rem;}
#home .topblock div p.appli-exe { padding:13px;}
#home .topblock > div.imgbox02 img { width:100%;}
#home .topblock > div.imgbox03 img { width:100%;}
#home .noticeblock dl dt { float:none; width:auto; margin:0 0 2px; padding:5px 5px 0; text-align:left; font-size:1.2rem;}
#home .noticeblock dl dd { margin:0 0 2px; padding:0 5px 5px; border-left:none; font-size:1.4rem;}
#home .noticeblock dl dd span { display:block; margin:5px 0 0; font-size:1.4rem;}
#home .noticeblock dl dd span a { display:inline-block;}
}

/*-----------------------------------------------------------------------------------------------------------------------------------------------------------------*/

/*LP用*/
#lp-header { position:relative; width:100%; margin:0 !important; padding:10px 0 15px; text-align:left !important; font-size:0; background:url(../img/com/h_bg.png) repeat-x bottom center; z-index:9999;}
#lp-header h1 { position:absolute; top:15px; left:2.5%; display:inline-block;}
#lp-header h1 a { display:block; vertical-align:middle; text-align:left; color:#002564; font-size:1.5vw; font-weight:normal; line-height:1.4;}
#lp-header h1 a:hover { text-decoration:none; opacity:0.7;}
#lp-header ul.subnavi { position:absolute; top:15px; right:5px; vertical-align:middle; height:30px; margin:0; padding:0; line-height:30px;}
#lp-header ul.subnavi li{ display:inline-block; vertical-align:middle; margin:0; margin-left:5px; padding:0; text-align:center; line-height:1.0;}
#lp-header ul.subnavi li a { display:block; margin:0; padding:5px; color:#333333; font-size:12px;
-moz-border-radius: 5px;    /* 古いFirefox */
-webkit-border-radius: 5px; /* 古いSafari,Chrome */
border-radius: 5px;         /* CSS3 */}
#lp-header ul.subnavi li a:hover{ text-decoration:none; color:#FFFFFF; background:#EB3F40;} 
#lp-header ul.subnavi li.current a { color:#FFFFFF; background-color:#EB3F40;}
#lp-header #mainlogo { display:block; vertical-align:bottom; width:320px; margin:0 auto; padding:0;}
#lp-header #mainlogo a img { width:100%; height:auto;}
#lp-header #mainlogo a:hover img { opacity:0.7;}
#lp-header .btn-area { vertical-align:middle; position:absolute; top:50px; right:5px; margin:0; padding:0;}
#lp-header .btn-area p { display:inline-block; margin:0 0 0 2px; width:60px; height:60px;}
#lp-header .btn-area p a { display:block; background-color:#505050;}
#lp-header .btn-area p a:hover { opacity:0.7;}
#lp-header .btn-area p a img { vertical-align:middle; width:100%;}
@media all and (max-width:929px)
{
#lp-header h1 { top:25px; left:1.0%;}
#lp-header h1 a { font-size:1.4vw;}
}
@media all and (max-width:719px)
{
#lp-header { height:135px; padding:5px 0; text-align:center !important;}
#lp-header h1 { position:absolute; top:85px; right:0; left:0; width:auto !important; margin:0; padding:0 10px; /*background:url(../img/com/h_bg.png) repeat-x bottom center;*/}
#lp-header h1 a { display:inline-block; margin:0 auto; text-align:left; font-size:1.4rem;}
#lp-header h1 a br.set01 { display:none;}
#lp-header ul.subnavi { display:none;}
#lp-header #mainlogo { width:240px;}
#lp-header .btn-area { top:20px;}
}
@media all and (max-width:529px)
{
#lp-header { height:110px;}
#lp-header h1 { top:60px;}
#lp-header #mainlogo { width:160px; height:auto;}
#lp-header .btn-area { top:5px;}
#lp-header .btn-area p { width:50px; height:50px;}
}
@media all and (max-width:449px)
{
#lp-header h1 a { text-align:center; font-size:1.2rem;}
#lp-header h1 a br { display:none;}
}
@media all and (max-width:419px)
{
#lp-header { height:100px;}
#lp-header #mainlogo { margin:0 115px 5px auto;}
}

#lp-mainimg01 { position:relative; width:100%; height:auto; min-height:85vh; margin:-5px 0 0; padding:0;
background-repeat:no-repeat;
background-image:url(../img/top/block-bg01.jpg);/*背景画像*/
background-size:cover;/*背景サイズ*/
background-position:center center;
background-attachment:fixed;/*画面からの相対位置（背景固定）*/}
@media all and (max-width:719px)
{
#lp-mainimg01 {
background-image:url(../img/top/block-bg01.jpg);/*背景画像*/
background-size:cover;/*背景サイズ*/
background-position:center center;
background-attachment:scroll;/*画面からの相対位置（背景固定）*/}
}
#lp-mainimg01 ul { width:100%; margin:0; padding:0; list-style:none; text-align:center !important; font-size:0; position:absolute; top:50%; left:50%; transform:translateY(-50%) translateX(-50%); -webkit-transform:translateY(-50%) translateX(-50%);}
#lp-mainimg01 ul li { display:inline-block; vertical-align:middle; padding:0 5px; font-size:64px; line-height:1.2; color:#333333;
text-shadow:
1px 1px 5px #FFFFFF, -1px 1px 5px #FFFFFF,
1px -1px 5px #FFFFFF, -1px -1px 5px #FFFFFF,
2px 2px 5px #FFFFFF, -2px 2px 5px #FFFFFF,
2px -2px 5px #FFFFFF, -2px -2px 5px #FFFFFF;
}
#lp-mainimg01 ul li span { display:inline-block;}
@media all and (max-width:719px)
{
#lp-mainimg01 ul li { margin:0 auto; font-size:3.8rem;}
}
#lp-mainimg01 ul li:nth-of-type(1) { margin:0; padding:8px 0 3px 15px; font-size:3.5vw; background-color:rgba(255,255,255,0.25);
-moz-border-radius: 15px;    /* 古いFirefox */
-webkit-border-radius: 15px; /* 古いSafari,Chrome */
border-radius: 15px;         /* CSS3 */}
#lp-mainimg01 ul li:nth-of-type(2) { display:block; margin:15px 0 0;}
#lp-mainimg01 ul li:nth-of-type(3) { margin:0; padding:8px 15px 3px; font-size:3.0vw; background-color:rgba(255,255,255,0.25);
-moz-border-radius: 15px;    /* 古いFirefox */
-webkit-border-radius: 15px; /* 古いSafari,Chrome */
border-radius: 15px;         /* CSS3 */}
#lp-mainimg01 ul li img { width:80%; max-width:480px;}
@media all and (max-width:719px)
{
#lp-mainimg01 ul li:nth-of-type(1) { padding:5px 0; font-size:5.5vw; font-weight:bold;
-moz-border-radius: 10px;    /* 古いFirefox */
-webkit-border-radius: 10px; /* 古いSafari,Chrome */
border-radius: 10px;         /* CSS3 */}
#lp-mainimg01 ul li:nth-of-type(3) { padding:5px; font-size:5.0vw; font-weight:bold;
-moz-border-radius: 10px;    /* 古いFirefox */
-webkit-border-radius: 10px; /* 古いSafari,Chrome */
border-radius: 10px;         /* CSS3 */}
#lp-mainimg01 ul li span { display:block;}
}
.lp-mainimg { width:100% !important; overflow:hidden;}

/*-----------------------------------------------------------------------------------------------------------------------------------------------------------------*/

/*似合うマッチとはページ*/
#about {}
#about h3 { display:inline-block; text-align:left; font-size:20px; font-weight:normal;}
#about h3 strong { color:#002564;}
#about .appli-exe { text-align:center;}
#about .appli-exe ul { display:inline-block; margin:20px auto; padding:18px; border:#EB3F40 2px solid; list-style:disc; text-align:left; font-size:18px;
-moz-border-radius: 10px;    /* 古いFirefox */
-webkit-border-radius: 10px; /* 古いSafari,Chrome */
border-radius: 10px;         /* CSS3 */}
#about .appli-exe ul li { margin-left:1em;}
#about .subcatch { display:inline-block; margin:0 0 40px; text-align:left; font-size:20px; font-weight:normal;}
#about .description { text-align:left; padding:18px; border:#999999 1px solid; font-size:16px;
-moz-border-radius: 5px;    /* 古いFirefox */
-webkit-border-radius: 5px; /* 古いSafari,Chrome */
border-radius: 5px;         /* CSS3 */}
#about .description p { display:inline-block; margin:20px 0 0;}
#about .description p:nth-of-type(1) { margin:0;}
#about .figure { display:inline-block; width:100%; max-width:640px; margin:40px auto 0; padding:0; border:#CCCCCC 1px solid; text-align:center; font-size:0;}
#about .figure img { width:100%;}
@media all and (max-width:719px)
{
#about h3 { font-size:1.8rem;}
#about .appli-exe ul { padding:13px; font-size:1.6rem;}
#about .subcatch { font-size:1.8rem;}
#about .description { padding:13px; font-size:1.4rem;}
}

/*似合うマッチの効果ページ*/
#effect {}
#effect h3 { display:inline-block; text-align:left; font-size:20px; font-weight:normal;}
#effect h3 strong { color:#002564;}
#effect .subcatch { display:inline-block; margin:40px 0 0; text-align:left; font-size:20px; font-weight:normal;}
#effect .effect-exp { text-align:center;}
#effect .effect-exp ul { display:inline-block; margin:20px auto; padding:18px; border:#EB3F40 2px solid; list-style:disc; text-align:left; font-size:16px;
-moz-border-radius: 10px;    /* 古いFirefox */
-webkit-border-radius: 10px; /* 古いSafari,Chrome */
border-radius: 10px;         /* CSS3 */}
#effect .effect-exp ul p { margin:0; padding:5px; font-size:18px; font-weight:bold; color:#FFFFFF; background-color:#EB3F40;}
#effect .effect-exp ul li { margin:20px 0 0 1em;}
#effect .effect-exp ul li h4 { margin:0 0 3px; color:#002564;}
@media all and (max-width:719px)
{
#effect h3 { font-size:1.8rem;}
#effect .subcatch { font-size:1.8rem;}
#effect .effect-exp ul { padding:13px; font-size:1.4rem;}
#effect .effect-exp ul p { font-size:1.6rem;}
}

/*似合うマッチの流れページ*/
#flow {}
#flow ul { margin:0; padding:0; list-style:none; font-size:0;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
justify-content:left;}
#flow ul li { margin:0; padding:0;}
#flow ul li:nth-of-type(1) { width:100%; font-size:20px; text-align:left;}
#flow ul li:nth-of-type(1) p { margin:0; text-align:center;}
#flow ul li:nth-of-type(1) p.point { margin:0 0 10px; padding:8px; padding-left:2.0em; text-align:left; color:#002564; text-indent:-1.0em; border:#CDCDCD 2px solid;
-moz-border-radius: 10px;    /* 古いFirefox */
-webkit-border-radius: 10px; /* 古いSafari,Chrome */
border-radius: 10px;         /* CSS3 */}
#flow ul li:nth-of-type(2) { flex-shrink:0; width:50%; max-width:640px; margin-left:20px;}
#flow ul li:nth-of-type(2) img { width:100%;}
#flow span { display:block; margin:0 0 0 10px; padding-left:1.0em; text-indent:-1.0em; text-align:left; font-size:14px;}
#flow span:before { content: "※";}
@media all and (max-width:719px)
{
#flow ul { display:block;}
#flow ul li:nth-of-type(1) { font-size:1.8rem;}
#flow ul li:nth-of-type(2) { flex-shrink:none; width:100%; max-width:640px; margin:20px auto;}
#flow ul span { margin:0 0 0 5px; font-size:1.2rem;}
}

/*似合うマッチの導入事例ページ*/
#case {}
#case .typeinfo { margin:0 0 20px; padding:5px 0 3px; border-bottom:#505050 3px double; font-size:20px; background-color:#F0F0F0;}
#case ul { margin:0; padding:0; list-style:none; font-size:0;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
justify-content:left;}
#case ul li { margin:0; padding:0;}
#case ul li:nth-of-type(1) { flex-shrink:0; width:60%; max-width:640px; margin-right:20px;}
#case ul li:nth-of-type(1) img { width:100%;}
#case ul li:nth-of-type(2) { width:100%; font-size:16px; text-align:left;}
#case ul li:nth-of-type(2) .point { margin:0 0 20px; padding:8px; border:#002564 2px solid;
-moz-border-radius: 10px;    /* 古いFirefox */
-webkit-border-radius: 10px; /* 古いSafari,Chrome */
border-radius: 10px;         /* CSS3 */}
#case ul li:nth-of-type(2) .point p { margin:0 0 5px; border-bottom:#002564 1px solid; color:#002564; font-size:18px; font-weight:bold;}
#case ul li:nth-of-type(2) .point span { display:block; padding-left:1.0em; text-indent:-1.0em; font-size:14px;}
#case ul li:nth-of-type(2) .point span:before { content: "※";}
@media all and (max-width:719px)
{
#case ul { display:block;}
#case .typeinfo { font-size:1.8rem;}
#case .typeinfo span { display:inline-block;}
#case ul li:nth-of-type(1) { flex-shrink:none; width:100%; max-width:640px; margin:0 auto; margin-bottom:20px;}
#case ul li:nth-of-type(2) { font-size:1.4rem;}
#case ul li:nth-of-type(2) .point p { font-size:1.6rem;}
#case ul li:nth-of-type(2) .point span { font-size:1.2rem;}
}

/*FAQページ*/
#faq {}
#faq .qalist dl { font-size:16px;}
#faq .qalist dl p { margin:30px 0 0; padding:10px; text-align:left; color:#FFFFFF; font-weight:bold; font-size:20px; background-color:#EB3F40;}
#faq .qalist dl p:nth-of-type(1) { margin:0;}
#faq .qalist dl dt { margin:10px 0 5px; padding:10px; padding-left:3.0em; text-indent:-3.0em; border-bottom:#333333 1px solid; text-align:left; background-color:#F0F0F0;}
#faq .qalist dl dt:before { padding-left:1.0em; text-indent:-1.0em; font-weight:bold; content: "Ｑ：";}
#faq .qalist dl dd { margin:0; padding:10px; padding-left:3.0em; text-indent:-3.0em; text-align:left; background-color:#FFFFFF;}
#faq .qalist dl dd:before { padding-left:1.0em; text-indent:-1.0em; font-weight:bold; color:#820041; content: "Ａ：";}
#faq .qalist dl dd > ul { display:inline-block; margin:10px 0 0; padding:9px; padding-left:2.0em; text-indent:0; border:#CCC 1px solid; list-style:disc;
-moz-border-radius: 10px;    /* 古いFirefox */
-webkit-border-radius: 10px; /* 古いSafari,Chrome */
border-radius: 10px;         /* CSS3 */}
#faq .qalist dl dd > ul li { margin-top:5px;}
#faq .qalist dl dd > ul li:nth-of-type(1) { margin-top:0;}
@media all and (max-width:719px)
{
#faq {}
#faq .qalist { padding:10px 0;}
#faq .qalist h3 { margin-bottom:10px; font-size:2.0rem;}
#faq .qalist dl { font-size:1.4rem;}
#faq .qalist dl p { font-size:1.8rem;}
#faq .qalist dl dt { padding:5px; padding-left:2.5em; text-indent:-2.5em;}
#faq .qalist dl dt:before { padding-left:0.5em; text-indent:-0.5em;}
#faq .qalist dl dd { padding:5px; padding-left:2.5em; text-indent:-2.5em;}
#faq .qalist dl dd:before { padding-left:0.5em; text-indent:-0.5em;}
#faq .qalist dl dd > ul { padding:5px; padding-left:2.0em;}
}

/*資料ダウンロードページ*/
#download { font-size:0;}
#download .dlbox { display:inline-block; vertical-align:top; width:48%; margin:0; padding:15px; border:#CCCCCC 1px solid; box-sizing:border-box; font-size:14px; background-color:#F6F6F6;}
#download .dlbox:nth-of-type(1) { margin-right:4%;}
#download .dlbtn { margin:0 auto 30px;}
#download .dlbtn a { display:block; padding:10px; color:#FFFFFF; font-size:24px; line-height:1.0em; background-color:#EB3F40;
-moz-border-radius: 10px;    /* 古いFirefox */
-webkit-border-radius: 10px; /* 古いSafari,Chrome */
border-radius: 10px;         /* CSS3 */}
#download .dlbtn a:hover { text-decoration:none; opacity: 0.7 !important;}
#download .dlbtn a img { display:inline-block; vertical-align:middle; margin:0 10px 0 0;}
#download .dlbtn a span.detail { display:block; vertical-align:middle; margin:0 0 0 10px; font-size:12px;}
#download .dlbtn a span.info { display:block; margin:0; padding:0; font-size:14px;}
#download ul.example { margin:0; padding:0; text-align:left; list-style:none; font-size:0;}
#download ul.example li { display:inline-block; vertical-align:top; width:48%; margin:0; padding:0; border:#999999 1px solid; box-sizing:border-box;}
#download ul.example li:nth-of-type(1) { margin-right:4%;}
#download ul.example li:nth-of-type(3) { margin-top:15px; margin-right:4%;}
#download ul.example li:nth-of-type(4) { margin-top:15px;}
#download ul.example li img { width:100%; max-width:960px;}
#download ul.example li:hover { opacity: 0.7 !important;}
#download .pageclose { display:inline-block; margin:30px auto;}
#download .pageclose a { display:block; padding:10px; color:#333333; font-size:20px; line-height:1.0em; background-color:#E8E8E8;
-moz-border-radius: 5px;    /* 古いFirefox */
-webkit-border-radius: 5px; /* 古いSafari,Chrome */
border-radius: 5px;         /* CSS3 */}
#download .pageclose a:hover { text-decoration:none; opacity: 0.7 !important;}
#download .caution { display:block; margin:0 0 40px; padding:0; text-align:center; font-size:18px;}
#download .caution p { display:inline-block; text-align:left;}
/*colorbox用*/
#cboxLoadedContent img { display:block; width:100% !important; max-width:1000px !important; min-width:500px !important; height:auto !important; margin:0 auto !important; padding:0 !important;}
@media all and (max-width:719px)
{
#download .dlbox { display:block; width:100%; padding:5px; font-size:1.4rem;}
#download .dlbox:nth-of-type(1) { margin-right:0; margin-bottom:30px;}
#download .dlbtn { display:block; margin:0 auto 20px;}
#download .dlbtn a { padding:10px 0; font-size:2.0rem;}
#download .dlbtn a span.detail { display:block; margin:0; font-size:1.2rem;}
#download .dlbtn a span.info { font-size:1.2rem;}
#download .pageclose a { font-size:1.8rem;}
#download .caution { font-size:1.6rem;}
}

/*フォーム部（お問合せ･資料請求ページ）*/
.inq-area { margin:0; padding:0; text-align:center; font-size:16px;}
.inq-area .form-box { display:inline-block; width:auto; margin:20px auto 0; padding:0 0 40px; text-align:center;}
.inq-area .form-box dl { margin:0 auto 10px;}
.inq-area .form-box dt { float:left; width:240px; margin-bottom:10px; padding:10px 10px 3px; text-align:left;}
.inq-area .form-box dt span { display:inline-block; vertical-align:middle; margin:0 5px; padding:0 5px; color:#FFFFFF; font-size:12px; font-size:1.2; background-color:#FF0000;}
.inq-area .form-box dt p { margin:10px 0 0; text-align:left;}
.inq-area .form-box dd { margin:0 0 10px 0; padding:5px 10px; border-left:250px #F0F0F0 solid; text-align:left; min-height:40px;}
.inq-area .form-box input[type=submit],
.inq-area .form-box input[type=reset],
.inq-area .form-box input[type=image],
.inq-area .form-box input[type=button] { margin:20px 10px 0; padding:10px 20px; font-size:14px; font-size:1.4rem;}
.inq-area .form-box input[type=text] { width:95%;}
.inq-area ul { margin:0; padding:0; list-style:none; text-align:center; font-size:0;}
.inq-area ul li { display:inline-block; vertical-align:top; width:32%; margin:10px 2% 0 0; padding:5px 0 0; color:#FFFFFF; font-size:22px; font-size:2.2rem; background-color:#B6B0B0;}
.inq-area ul li:last-child { margin:10px 0 0;}
.inq-area ul li p { display:block; text-align:center; padding:5px 0; border-top:#897B7B 1px dotted; color:#333333; font-size:28px; font-size:2.8rem; background-color:#F8F5F3; font-weight:normal !important; font-family:"Times New Roman", Times, serif !important; transform: rotate(.00deg) !important;}
@media all and (max-width:719px)
{
.inq-area .form-box { width:100%; margin:0 auto; padding:0 0 30px;}
.inq-area .form-box dl { margin:10px 0 0}
.inq-area .form-box dt { float:none; width:auto; margin-bottom:2px; padding:5px 10px; text-align:left; background-color:#F0F0F0;}
.inq-area .form-box dd { margin:0 0 10px 0; padding:5px; border:none; text-align:center;}
.inq-area .form-box dd.sp-list { text-align:left;}
.inq-area .form-box input[type=text], .inq-area .form-box textarea { width:90%;}
.inq-area .form-box input[type=submit],
.inq-area .form-box input[type=reset],
.inq-area .form-box input[type=button] { max-width:none; min-width:30%;}
.inq-area ul li { display:block; vertical-align:top; width:auto; margin:10px 0 0;}
}
@media all and (max-width:539px)
{
.inq-area { font-size:1.4rem;}
.inq-area h3 { font-size:1.6rem;}
}
/*お問合せページ*/
#inquiry { margin:0; text-align:center;}
#inquiry .inq-area .form-box dt { color:#FFFFFF;}
#inquiry .inq-area .form-box dt span { background-color:#002564;}
#inquiry .inq-area .form-box dd { border-left-color:#EB3F40;}
@media all and (max-width:719px)
{
#inquiry .inq-area .form-box dt { background-color:#EB3F40;}
}
/*資料請求ページ*/
#request { margin:0; text-align:center;}
#request .inq-area .form-box dt { color:#FFFFFF;}
#request .inq-area .form-box dt span { background-color:#EB3F40;}
#request .inq-area .form-box dd { border-left-color:#002564;}
@media all and (max-width:719px)
{
#request .inq-area .form-box dt { background-color:#002564;}
}

/*会社概要ページ*/
#corporate { font-size:0;}
#corporate h3 { margin:40px 0 10px; padding:15px 0 10px; border-bottom:#333333 2px solid; font-size:24px; background-color:#F3F3F3;}
#corporate h3:nth-of-type(1) { margin:0 0 10px;}
#corporate .outline { display:block; float:none; box-sizing:border-box; width:100%; margin:0; padding:0;}
#corporate .outline > p { margin:0 0 20px; padding:18px; border:#CCCCCC 2px solid; text-align:left; font-size:16px;
-moz-border-radius: 20px;    /* 古いFirefox */
-webkit-border-radius: 20px; /* 古いSafari,Chrome */
border-radius: 20px;         /* CSS3 */}
#corporate .outline dl { margin:0; padding:5px 5px 0; border:#CCCCCC 1px solid; font-size:14px; font-size:1.4rem; z-index:0;}
#corporate .outline dl dt { float:left; width:120px; margin:0 0 5px; padding:5px 10px; text-align:center;}
#corporate .outline dl dd { margin:0 0 5px; padding:5px 10px 5px; border-left:#F2F2F2 120px solid; border-bottom:#CCCCCC 1px dotted; text-align:left;}
#corporate .outline dl dd span { display:inline-block; margin:0 0 0 10px;}
#corporate .mp-box { border:#CCCCCC 1px solid;}
#corporate .mp-box iframe { width:100%; height:60vh;}
@media all and (max-width:639px)
{
#corporate {}
#corporate h3 { font-size:2.0rem;}
#corporate .outline > p { margin:0 0 20px; padding:8px; font-size:1.6rem;
-moz-border-radius: 10px;    /* 古いFirefox */
-webkit-border-radius: 10px; /* 古いSafari,Chrome */
border-radius: 10px;         /* CSS3 */}
#corporate .outline dl { margin:0; padding:5px 5px 0; border:#CCCCCC 1px solid; font-size:14px; font-size:1.4rem; z-index:0;}
#corporate .outline dl { display:block; width:auto; margin:10px 0 0; padding:5px 5px 0;}
#corporate .outline dl dt { float:none; width:auto; margin:0; text-align:left; background-color:#F2F2F2;}
#corporate .outline dl dd { border:none;}
}

/*プライバシーポリシーページ*/
#privacy {}
#privacy h3 { display:inline-block; margin:0 0 20px; padding:0; text-align:left !important; font-size:16px; font-size:1.6rem; font-weight:normal;}
#privacy ul { margin:0 0 0 0.5em; padding:0 0 0 1.0em; text-align:left; font-size:14px; font-size:1.4rem;}
#privacy ul li { margin:0 0 20px; color:#EB3F40; font-weight:bold;}
#privacy ul li p { color:#333333; font-weight:normal;}
#privacy ul li p span { display:block; margin:10px 0 0;}
@media all and (max-width:411px)
{
#privacy {}
}

/*20200225追加--------------------*/
#bnr-case { position:absolute; top:-65px; right:50px; margin:0; padding:0; border:#EB3F40 0px solid; z-index:5; background-color:#F0E600;
-moz-border-radius: 5px;    /* 古いFirefox */
-webkit-border-radius: 5px; /* 古いSafari,Chrome */
border-radius: 5px;         /* CSS3 */}
#bnr-case h2 { margin:0; padding:5px 0 2px; border-bottom:#EB3F40 1px dotted; text-align:center; font-size:1.3rem; line-height:1.2;}
#bnr-case a:hover { opacity:0.7;}
#bnr-case a img { display:inline-block; vertical-align:middle; width:250px;}
@media all and (max-width:1039px)
{
#home h2.contents-title,
#about h2.contents-title,
#effect h2.contents-title,
#flow h2.contents-title,
#case h2.contents-title { text-align:left;}
}
@media all and (max-width:819px)
{
#bnr-case { position:relative; top:auto; right:auto; display:inline-block; margin:30px auto -40px;}
#home h2.contents-title,
#about h2.contents-title,
#effect h2.contents-title,
#flow h2.contents-title,
#case h2.contents-title { text-align:center;}
}
@media all and (max-width:719px)
{
#bnr-case { margin:30px auto 0;}
}

