@charset "utf-8";

/**
 *
 *  サービス紹介
 *
 */

 /*--------------------------------------------------------------------------
   overwrite
---------------------------------------------------------------------------*/
#Footer{
	margin-top: -3px;
}

 /*--------------------------------------------------------------------------
   layout
---------------------------------------------------------------------------*/

.main-inner{
	width:606px;
	margin-left: 120px;
}
#dev-smp .main-inner{
	width:606px;
	margin:0 auto;
}

.main-inner h2.ttl{
	height: 60px;
	margin-bottom: 20px;
	background:url(../images/common/bg_lineup.jpg) no-repeat left bottom;
}

/* ページスクロール用位置調整 */
#Feature,#Area,#Effect{
	margin-top: -20px;
	padding-top:20px;
}

 /*--------------------------------------------------------------------------
   head
---------------------------------------------------------------------------*/
.page-head h1{
	top:40px;
	color:#182C4C;
	font-size:186%;
	font-weight:bold;
}

/*--------------------------------------------------------------------------
   Subnav
---------------------------------------------------------------------------*/
#Subnav{
	position:absolute;
	left:0;
	top:0;
}
#dev-smp #Subnav{
	display:none;
}

/*--------------------------------------------------------------------------
   contents-head
---------------------------------------------------------------------------*/
.contents-head{
	margin-bottom: 30px;
}
.contents-head h2{
	color:#182C4C;
	font-size:143%;
	font-weight: bold;
	margin-bottom: 15px;
}

/*--------------------------------------------------------------------------
   Feature
---------------------------------------------------------------------------*/
#Feature{
	padding-bottom: 5px;
}
#Feature h3{
	margin-bottom: 15px;
}
#Feature h4{
	margin:0 0 5px 0;
	font-weight:bold;
	font-size:107%;
	color:#193152;
}
#Feature p{
	margin-bottom: 25px;
}

/*--------------------------------------------------------------------------
   Area
---------------------------------------------------------------------------*/
#Area{
	width:606px;
	margin-bottom: 30px;
}
#Area h4{
	margin:0 0 5px 0;
	font-weight:bold;
	font-size:107%;
	color:#193152;
}
#Area .control{
	margin-bottom: 30px;
}
#Area .control area{
	cursor:pointer;
}

#Area .list-service li{
	width:606px;
	margin:30px 0 0;
}
#Area .list-service li:first-child{
	margin-top: 0;
}
#Area li .ttl{
	height: 57px;
	padding-left: 20px;
	background:url(../images/detail/bg_service_close.jpg) no-repeat;
	color:#193152;
	font-size:122%;
	font-weight:bold;
	line-height:57px;
	cursor:pointer;
}
#Area li .open{
	background:url(../images/detail/bg_service_open.jpg) no-repeat;
}
#Area li .acc{
	position:relative;
	width:618px;
	margin:0 0 0 -12px;
}
#Area .summary{
	width: 297px;
	margin: 15px 0 0 12px;
	float: left;
	background:url(../images/detail/bg_list_area_rp.jpg) repeat-y;
}
#Area .summary .sum-inner{
	background:url(../images/detail/bg_list_area_bt.jpg) no-repeat left bottom;
}
#Area .summary h3{
	padding: 25px 20px 10px;
	background:url(../images/detail/bg_list_area_tp.jpg) no-repeat;
	font-size:108%;
	font-weight:bold;

}
#Area .summary .sum-cont{
	padding: 0 20px 15px;
	font-size:86%;
}
#Area .summary p{
	margin-bottom: 8px;
}
#Area .summary dt{
	font-weight:bold;
}
#Area .summary dd{
	margin-bottom: 8px;
}
#Area .summary .detail a{
	padding-left: 13px;
	background:url(../images/detail/bg_arrow.png) no-repeat left 1px;
	font-size:109%;
}

#Area .summary ul,
#Area .summary ol {
	width:242px;
	padding-left:5px;
	margin:5px 0 5px 10px;
}
#Area .summary ul li,
#Area .summary ol li {
	width:242px;
	margin:0;
	list-style-type:disc !important;
}
#Area .summary ol li {
	list-style-type:decimal !important;
}

#Area .all-open{
	text-align: right;
	margin:0 0 20px 0;
}

/*--------------------------------------------------------------------------
   Effect
---------------------------------------------------------------------------*/
.main-inner #Effect h2.ttl{
	margin-bottom:3px;
}
#Effect{
	width:606px;
}
#Effect .list-effect{
	position:relative;
	width:626px;
	margin:0 0 10px -20px;
}
#Effect .list-effect li{
	width: 293px;
	margin: 17px 0 0 20px;
	padding-bottom: 10px;
	float: left;
	background:url(../images/detail/bg_list_effect_btm.jpg) no-repeat left bottom;
}
#Effect .list-inner{
	border:1px solid #CBCBCB;
	border-bottom:none;
}
#Effect .list-inner .ttl{
	width: 235px;
	padding:10px 15px 10px 42px;
	background:url(../images/detail/icon_list_effect.jpg) no-repeat 15px 9px #BDD3F2;
	color:#172E4E;
	font-weight:bold;
	line-height:1.5;
}
*:first-child+html #Effect .list-inner .ttl{
	line-height:1.4;
}
#Effect .list-inner .txt{
	padding: 15px;
	font-size:86%;
}
#Effect .recommend {
	position: relative;
	zoom:1;
	margin:25px 0 0;
	background:url(../images/detail/bg_recommend_bt.jpg) no-repeat left bottom;
	padding: 5px 0 8px;

}
#Effect .recommend .ttl{
	position: absolute;
	top:0;
	left: 20px;
}
#Effect .rcm-inner{
	padding:50px 0 18px 20px;
	border:1px solid #CBCBCB;
	border-bottom:none;
	background:#F4F5F7;
}
#Effect .recommend .list-rcm{
	zoom:1;
	margin-left: -10px;
}
#Effect .recommend .list-rcm li{
	width: 278px;
	margin: 10px 0 0 10px;
	padding: 0;
	float: left;
	background:none;
	border-right:1px solid #AAABAC;
	border-bottom:1px solid #AAABAC;
}
#Effect .recommend .list-rcm p{
	display:table-cell;
	vertical-align:middle;
	width: 244px;
	margin:-1px 0 0 -1px;
	padding: 15px;
	background: #FFF;
	border-left: 5px solid #193152;
	font-weight: bold;
	text-align:center;
}
#Effect .recommend p.txt-etc {
	clear:both;
	padding:8px 20px 0 0;
	font-size:116%;
	font-weight: bold;
	text-align: right;
}

/*--------------------------------------------------------------------------
   Case
---------------------------------------------------------------------------*/
#Case{
	zoom:1;
	padding-top: 5px;
	background:url(../images/detail/bg_case_tp.png) repeat-x;
}
#Case .case-outer{
	zoom:1;
	background:url(../images/detail/bg_case_rp.jpg);
}
#Case .case-inner{
	position: relative;
	width:978px;
	margin:0 auto;
	padding: 40px 0;
}
#Case .case-inner h2{
	margin-bottom: 25px;
}
#Case .case-inner ul{
	position:relative;
	width:998px;
	margin:0 -10px;
}
#Case .case-inner li{
	overflow:hidden;
	width: 479px;
	margin: 0 10px 15px;
	float: left;
}
#Case .case-inner li .pic{
	padding: 8px;
	float: left;
	margin:0 17px 0 0;
	background:url(../images/detail/bg_case_pic.png) no-repeat;

}
#Case .case-inner li .txt{
	overflow:hidden;
	zoom:1;
	padding:15px 0 0;
}
#Case .case-inner li .ttl{
	padding: 0 0 10px 13px;
	background:url(../images/detail/bg_arrow.png) no-repeat left 5px;
	color:#0070BF;
	font-weight: bold;
	line-height:1.5;
}
#Case .case-inner li p.ex{
	font-size:93%;
}
#Case .case-inner .btn{
	position:absolute;
	top:42px;
	right:0;
}

#dev-smp #Case .case-inner{
	width:726px;
}
#dev-smp #Case .case-inner ul{
	position:relative;
	width:726px;
	margin:0;
}
#dev-smp #Case .case-inner li{
	width: 726px;
	margin: 0 0 15px;
	float: none;
}


/*trial*/
.trial{
	text-align:center;
	margin-top:20px;
	width:546px;
	display:block;
	border:4px solid #35a16b;
	padding:20px;
}

.trial h4{
	font-size:20px;
	font-weight:bold;
	color:#35a16b;
}

.trial_form{
	width:400px;
	margin-top:20px;
	margin-left:80px;
}

.trial_form a{
	display:block;
	background-color:#35a16b;
	padding:10px;
	color:#FFF;
}

.trial_form a:hover{
	background-color:#66ca98;
}

/*ec 20200205*/
.ec_cont{
	text-align: center;
}

.ec_cont_h4{
	font-weight:bold;
	line-height: 1.2;
	font-size:20px;
}

.ec_cont h5{
	font-size:14px;
	display:inline-block;
	width:97%;
	padding:6px;
	margin-top:30px;
}

.ec_cont h6{
	font-weight:bold;
	line-height: 1.2;
	font-size:18px;
	margin-top:30px;
}

.ec_cont img{
	margin-top:20px;
}

.p_color{
	color:#f29600;
}

.b_color{
	color:#7b59a2;
}

.p_color_b{
	border:2px solid #f29600;
}

.b_color_b{
	border:2px solid #7b59a2;
}

.kaiin_1{
	display: flex;
	margin-top:10px;
}

.kaiin_1 p{
	margin-right:20px;
	margin-top:20px;
}

.kaiin_1 img{
	margin-top:20px;
	margin-bottom:20px;
}

.kaiin_onlineshoplink{
	text-align:center;
	margin-top: 20px;
	margin-bottom:30px;
	display:block;
	border:3px solid #eee;
	padding:20px;
}

.kaiin_onlineshoplink span{
	color:red;
	font-weight:bold;
}

.kaiin_onlineshoplink a{
	display:block;
	background-color:#666;
	color:#fff;
	font-weight:bold;
	padding:6px;
	border-radius: 6px;
	text-decoration: none;
}

.kaiin_onlineshoplink a:hover{
	background-color: #333;
}

.sankou{
	text-align:right;
	font-size:80%;
	margin-top:40px;
}


.article blockquote{
	display:block;
	padding:20px;
	border:1px dotted #999;
	font-size:90%;
	margin-bottom:20px;
}

.article blockquote div{
	text-align:right;
}

.tenjikai{
	display:block;
	background-color:#FCB900;
	padding:20px;
}

.tenjikai_title{
	font-size:125%;
	font-weight:bold;
}

.new_kinou{
	color:darkred;
}


.am_btn{
	text-align: center; 
	margin:30px 200px auto 200px;;
}


.am_btn a {
	display: block;
  border: solid 1px #1a5099;
  border-radius: 50px;
  padding: 16px 10px 16px 20px;
  text-align: center;
  position: relative;
}

.am_btn a:hover {
	background-color: #9ed8f5;
	text-decoration: none;
}

/*告知用*/
.kokuti{
	display: block;
	background-color:#fcb900;
	padding: 36px;
	text-align: center;
	margin-bottom:40px;
}

.kokuti .k_title{
	font-size:20px;
	font-weight:bold;
	background: linear-gradient(transparent 70%, white 70%);
    display: inline-block;
}

.kokuti .k_title_sub{
	font-size:14px;
	font-weight:bold;
	margin-top: 4px;
}

.kokuti .k_link{
	
}

.kokuti .k_link a{
	display: block;
	background-color: #333;
	color:#fff;
	margin-top:20px;
	padding:10px;
}

.kokuti .k_link a:hover{
	background-color: #666;
	text-decoration: none;
}

.kokuti p{
	margin-top:20px;
	line-height: 1.8;
}

.kokuti p span{
	border:1px solid #000;
	padding:4px;
	margin:auto 4px;
	font-weight:bold;
}

/*サービス用CTA*/
.cont-bn{
	background-color: #1e406d;
	padding:30px;
	text-align: center;
}

.cont-bn p{
	font-size:20px;
	font-weight:bold;
	color:#fff;
	margin-bottom:20px;
}

.cont-bn .cont-bn-li{
	display:flex; 
}

.cont-bn .cont-bn-li li{
	background-color: #fff;
	padding:30px;
	width:334px;
}

.cont-bn .cont-bn-li dt{
	margin-bottom:10px;
}

.cont-bn .cont-bn-li dd a{
	display:block;
	background-color:#9e2c3b;
	color:#fff;
	padding:10px;
	border-radius: 24px;
	text-decoration: none;
}

.cont-bn .cont-bn-li dd a:hover{
	font-style: normal;
	text-decoration: none;
	background-color: #bb0000;
}


/*サービス用CTA 記事途中*/
.cont-bn2{
	margin-top:20px;
	margin-bottom:40px;
	background-color: #eee;
	padding:0 30px;
	text-align: center;
}

.cont-bn2 .cont-bn-li{
	display:flex; 
}

.cont-bn2 .cont-bn-li li{
	padding:30px;
	width:334px;
}

.cont-bn2 .cont-bn-li dt{
	margin-bottom:10px;
}

.cont-bn2 .cont-bn-li dd a{
	display:block;
	background-color:#9e2c3b;
	color:#fff;
	padding:10px;
	border-radius: 24px;
	text-decoration: none;
}

.cont-bn2 .cont-bn-li dd a:hover{
	font-style: normal;
	text-decoration: none;
	background-color: #bb0000;
}