@charset "utf-8";

/* トップページ
--------------------------------------------------------------- */

/* トップページ - メインビジュアル */

.topVisual{
	height:470px;
	margin-bottom:20px;
}

.topVisual .vMenuWrap{
	color:#FFF;
	margin-top:50px;
	height:420px;
	background:#012D77;/* old browsers */
	background:-webkit-gradient(linear, left top, left bottom, from(#023893), to(#012D77));
	background:-webkit-linear-gradient(top, #023893, #012D77);
	background:linear-gradient(to bottom, #023893, #012D77);
}

.topVisual .vInner{
	position:relative;
	width:1020px;
	height:420px;
	margin:0 auto;
}

.topVisual .vMenu{
	position:absolute;
	top:0;
	left:0;
}

.topVisual .vMenu li{
	width:172px;
	margin-bottom:1px;
	background-size:28px;
	background-position:20px center;
	background-repeat:no-repeat;
}

.topVisual .vMenu li a{
	position:relative;
	display:block;
	height:69px;
	line-height:69px;
	padding-left:63px;
	background:rgba(11,30,63,1);
	color:#FFF;
	text-decoration:none;
	font-family:arial, sans-serif;
	letter-spacing:.09em;
	font-size:14px;
	overflow:hidden;
}

.topVisual .vMenu li a span{
	display:inline-block;
	transform:scale(.85,1);
	transform-origin: left top;
}

.topVisual .vMenu li:last-child a{
	height:70px;
}

.topVisual .vMenu li a:hover{
	background:rgba(11,30,63,.6);
}

.topVisual .vMenu li a:before{
	display:block;
	content:"";
	position:absolute;
	top:0;
	bottom:0;
	left:19px;
	margin:auto;
	background-size:contain;
	line-height:1;
}

.topVisual .vMenu li.media a:before{width:28px; height:22px; background-image:url(../img/top/pict_media.png);}
.topVisual .vMenu li.promo a:before{width:28px; height:22px; background-image:url(../img/top/pict_promo.png);}
.topVisual .vMenu li.creative a:before{width:28px; height:27px; background-image:url(../img/top/pict_creative.png);}
.topVisual .vMenu li.web a:before{width:28px; height:25px; background-image:url(../img/top/pict_web.png);}
.topVisual .vMenu li.sem a:before{width:28px; height:23px; background-image:url(../img/top/pict_sem.png);}
.topVisual .vMenu li.consumer a:before{width:28px; height:20px; background-image:url(../img/top/pict_consumer.png);}


/* トップページ - スライダー */

.topVisual .showArea{
	position:absolute;
	top:-50px;
	right:0;
	width:819px;
	height:520px;
	background:url(../img/slider/bg.png) 0 0 / 820px auto no-repeat;
	color:#333;
}

#keySlider{
	position:relative;
	width:100%;
	height:100%;
}

#keySlider li{
	width:819px;
	min-height:520px;
}

#keySlider li div{
	box-sizing:border-box;
	position:absolute;
	top:0;
	bottom:0;
	margin:auto;
	width:100%;
	height:70px;
	text-align:center;
	font-size:24px;
	font-weight:bold;
	padding-left:15px;
	font-family:"游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Verdana, sans-serif;
}


#keySlider li.txt1 div{height:65px;}
#keySlider li.txt2 div{height:29px;}
#keySlider li.txt3 div{height:65px;}
#keySlider li.txt4 div{height:29px;}
#keySlider li.txt5 div{height:33px;}
#keySlider li.txt6 div{height:80px;}

#keySlider li div{line-height:1;}
#keySlider li div img{width:auto; height:100%; padding:8px 0 0 5px;}
#keySlider li.txt5 div img{padding-top:14px;}


/* トップページ - サービス一覧 */

.serviceWrap{
	margin:0 0 20px;
}

.serviceWrap a:hover img{filter: alpha(opacity=100); -moz-opacity:1; opacity:1;}
.serviceWrap li img{width:100%; height:auto; border-radius:5px; margin-bottom:10px;}
/*.serviceWrap li h3{font-weight:bold; margin-bottom:10px; line-height:1; color:#023894;}*/
.serviceWrap li h3{
	margin-bottom:10px;
	line-height:1;
	color:#fff;
	padding:5px 10px;
	border-radius:5px;
	background:#023894;
	text-align:center;
}
.serviceWrap li i{margin-right:.5em;}

.serviceWrap li{
	float:left;
    line-height:1.4;
    margin:0 16px 16px 0;
    width:236px;
}

.serviceWrap li:nth-of-type(3n){margin-right:0;}

.serviceWrap li .more{
	padding:10px 0 0;
	color:#023894;
	text-decoration:underline;
}

.serviceWrap li a{
	display:block;
	color:#333;
	text-decoration:none;
}

.serviceWrap li a:hover{filter: alpha(opacity=80); -moz-opacity:.8; opacity:.8;}


	/* 2カラム版 */

	.serviceWrap.col2 li{
		float:left;
		width:49%;
		margin:0 0 16px;	
	}
	
	.serviceWrap.col2 li:nth-of-type(2n){
		float:right;
	}
	
	.serviceWrap.col2 li:nth-of-type(2n+1){
		clear:both;
	}


/* トップページ - 新着情報 */

#infoWrap {
    position: relative;
}

.infoBox{
	font-size:14px;
}


.infoBox dt {
    float: left;
    padding: 0 0 8px;
    width: 120px;
}


.infoBox dd {
    border-bottom: 1px solid #ccc;
    margin-bottom: 10px;
    padding-bottom: 8px;
}

#infoWrap .listTxt {
    font-size: 93%;
    padding-left: 20px;
    position: absolute;
    right: 0;
    top: 7px;
}

#infoWrap .listTxt a{
	color:#333;
}


/* 新聞JP - クラス引き継ぎ
--------------------------------------------------------------- */

.borderBox {
    border: 1px solid #ccc;
	padding:10px;
}


.formatDl dl {
    float: left;
}
.formatDl dt {
    margin-bottom: 5px;
    width: 362px;
}
.formatDl dd {
    margin-bottom: 20px;
    width: 362px;
}


/* リテール
--------------------------------------------------------------- */

.retailBox{
	border-top:1px solid #CCC;
	border-bottom:1px solid #CCC;
	margin-bottom:15px;
}

.retailBox .retailTxtArea{
	float:left;
	width:349px;
}

.retailBox .txtBox01{
	text-align:center;
	padding:10px 5px 5px 0;
	border-bottom:1px solid #CCC;
}

.retailBox .txtBox01 img{
	margin-bottom:5px;
}

.retailBox .txtBox02{
	padding:15px 5px 15px 0;
	border-bottom:1px solid #CCC;
}

.retailBox .txtBox03{
	padding:15px 20px 15px 0;
}

.retailBox .retailImgArea{
	float:left;
	width:385px;
	border-left:1px solid #CCC;
	padding:10px 0 5px 5px;
}

.retailBox .retailImgArea img{
	width:100%;
	margin-bottom:5px;
}


/* Web制作 - CMSホームページ
--------------------------------------------------------------- */

.cmsArea .list{float:left; width:285px; margin-right:10px;}
.cmsArea .img{float:left; width:290px; margin-right:20px;}
.cmsArea .link{float:left;}

.cmsBox{
	vertical-align:top;
	margin-bottom:10px;
}

.cmsBox:last-child{margin-bottom:0;}

.cmsBox dt{
	border:1px solid #ccc;
	background:#eee;
	text-align:center;
	font-weight:bold;
	padding:5px;
}

.cmsBox dd{
	padding:5px;
	border:1px solid #CCC;
	border-top:0;
	line-height:1.2;
}

.cmsBox dd a{
	display:block;
	text-align:center;
	color:#fff;
	width:120px;
	padding:10px;
	box-sizing:border-box;
	line-height:1;
	background:#084F0B;
	text-decoration:none;
	
	-webkit-transition:0.3s;
	-moz-transition:0.3s;
	-o-transition:0.3s;
	transition:0.3s;
}

.cmsBox dd a:hover{
	background:#023894;
}

.cmsBox dd p{
	font-size:11px;
}


/* クリエイティブ
--------------------------------------------------------------- */

#contentArea .imgArea {
    float: left;
    margin: 0 20px 20px 0;
}


/* お問い合わせ・メールフォーム
--------------------------------------------------------------- */
 
.formArea{
    font-size:14px;
    padding-top:20px;
}
 
.formArea .formRow{
    border-bottom:1px dotted #ccc;
    clear:both;
    padding:0 0 25px;
    margin-bottom:25px;
}
 
.formArea .formItemH{
    float: left;
    width: 210px;
	font-weight:bold;
}
 
.formArea .formItemD{
    float: left;
    width: 530px;
}
 
.formArea input[type="text"],
.formArea input[type="email"],
.formArea textarea {
    border:1px solid #999;
    box-sizing: border-box;
    font-size: 14px;
    padding: 7px 10px;
    width: 100%;
}

.formArea .s50 input[type="text"]{width:50%;}

.formArea select{
	box-sizing: border-box;
	padding: 7px 10px;
	border:1px solid #999;
}
 
.formArea .req{
    background: #900 none repeat scroll 0 0;
    color: #fff;
    font-size: 12px;
	font-weight:normal;
    margin-left: 1em;
    padding: 5px 10px;
}
 
.formArea input[type="submit"],
.formArea .wpcf7c-btn-back{
    background: #023894 none repeat scroll 0 0;
    border: 0 none;
    color: #fff;
    cursor: pointer;
    font-size: 18px;
    margin: 0 10px;
    padding: 10px 40px;
}

.formArea .wpcf7c-btn-back{background:#666;}

/* フォント */
.formArea input[type="text"],
.formArea input[type="email"],
.formArea textarea,
.formArea select,
.formArea input[type="submit"],
.formArea .wpcf7c-btn-back{
	font-family: "ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","メイリオ",Meiryo,Verdana,"游ゴシック",YuGothic,sans-serif;
}

.cloudBox{
	text-align: center;
	margin: 2em 0;
	line-height: 1;
}
 

/* 確認クラス */
.wpcf7c-conf{
    background:none !important;
	border:0 !important;
}
 
.mfStyle1{height:70px;}


/* RSSクラス改変
--------------------------------------------------------------- */

.rssTbl th,
.rssTbl td{
	vertical-align:top;
	padding:0 0 15px !important;
}

.rssTbl td:first-child{padding-right:20px !important;}

.rssTbl li{
	padding:0 0 10px;
	margin-bottom:15px;
}

.rssTbl li > a,
.rssTbl li > a + br{
	display:none;
}

.rsspaging_prev{float:left;}
.rsspaging_next{float:right;}


/* 見出し
--------------------------------------------------------------- */

.hType01 {
    background: url(../img/common/h_bg01.png) left bottom no-repeat;
    color: #023894;
    font-size: 16px;
    font-weight: bold;
    letter-spacing: 0.01em;
    margin-bottom: 20px;
    padding-bottom: 10px;
}

.hType02 {
    border-bottom: 1px solid #999;
    color: #b7042d;
    font-size: 108%;
    font-weight: bold;
    margin-bottom: 20px;
    padding-bottom: 5px;
}

.hType03 {
    color: #023894;
    font-size: 108%;
    font-weight: bold;
    margin-bottom: 5px;
}


/* テーブル
--------------------------------------------------------------- */

/* タイプ1 */
.tblType01{
  width:100%;
  margin-bottom:10px;
}

.tblType01 th, .tblType01 td{
  padding:8px 10px;
  vertical-align:top;
  border-bottom:1px solid #CCC;
}

.tblType01 th{
  text-align:right;
  border-right:1px solid #CCC;
  color:#013893;
}

.tpr{text-align:right;}
.tt{text-align:center;}

.tblType01 tr:nth-child(even){
  background:#F5F5F5;
}


/* タイプ2 */
.tblType02 {
    margin-bottom: 10px;
    width: 100%;
}

.tblType02 th, .tblType02 td {
    border: 1px solid #ccc;
    padding: 10px 20px;
    text-align: left;
    vertical-align: top;
}

.tblType02 th {
    background: #f6f6f6 none repeat scroll 0 0;
    color: #013893;
}

@media screen and (min-width:641px){
	.tblThR th {
		text-align: right !important;
	}
}

.w170{width:170px;}
.w190{width:190px;}

.tblType03{
	width:100%;
	margin-bottom:15px;
}

.tblType03 th,
.tblType03 td{padding:10px; border-bottom:1px solid #ccc; min-width:100px; text-align:left; vertical-align:top;}

.tblType03 th{font-weight:bold;}


/* タイプ4 */
.tblType04 {
    width: 100%;
}

.tblType04 th, .tblType04 td {
    border: 1px solid #ccc;
    padding: 10px 20px;
    text-align: left;
    vertical-align: top;
}

.tblType04 th {
    background: #f6f6f6 none repeat scroll 0 0;
    color: #013893;
}

.tblType04:not(:last-child){
	margin-bottom:30px;
}


/* リスト
--------------------------------------------------------------- */

.listType01{margin-bottom:20px;}
.listType01 li:before{
	content:"●";
}

.listType02{
	margin-bottom:20px;
	margin-left:1em;
}
.listType02 li{
	margin-bottom:10px;
	text-indent:-1em;
}
.listType02 li:before{
	content:"●";
}


/* ボタン
--------------------------------------------------------------- */

.buttonType01{
	display:inline-block;
	text-align:center;
	padding:5px 20px;
	color:#FFF;
	border-radius:3px;
	
	background-image: -moz-linear-gradient(top, #0243AE, #012054);
	background-image: -ms-linear-gradient(top, #0243AE, #012054);
	background-image: -o-linear-gradient(top, #0243AE, #012054);
	background-image: -webkit-gradient(linear, center top, center bottom, from(#0243AE), to(#012054));
	background-image: -webkit-linear-gradient(top, #0243AE, #012054);
	background-image: linear-gradient(top, #0243AE, #012054);
	
	-webkit-transition:0.3s;
	-moz-transition:0.3s;
	-o-transition:0.3s;
	transition:0.3s;
	
	margin:5px 0 0;
}

.buttonType01:hover{
	opacity:.8;
	text-decoration:none;
}


@media screen and (max-width:640px){

.buttonType01{
	display:block;
}
	
}


/* 装飾
--------------------------------------------------------------- */

.bigf{
    color: #cc0000;
    font-size: 130%;
    font-weight: bold;
}


/* 新聞広告
--------------------------------------------------------------- */

.shinbunStyle1_L{
	float:right;
	width:292px;
	margin:0 0 0 15px;
}

.btnFootContact a {
    border: 1px solid #ccc;
    color: #8c4600;
    display: block;
    font-size: 16px;
    font-weight: bold;
    padding: 10px;
    text-align: center;
    text-decoration: none;
}


/* SEM
--------------------------------------------------------------- */

.arrowList li{
	position:relative;
	text-align:center;
	margin-bottom:40px;
}

.arrowList li:not(:last-child):after{
	content:"";
	position:absolute;
	bottom:-30px;
	left:50%;
	margin-left:-20px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 20px 20px 0 20px;
	border-color: #023894 transparent transparent transparent;
}

.dtBox01{
	border:1px solid #D2DCFF;
	padding:20px;
	background:#F4F7FF;
	margin-bottom:40px;
}

.dtBox01 h3{
	font-weight:bold;
	border-left:3px solid #023894;
	padding-left:10px;
	color:#023894;
	margin-bottom:20px;
}

.dtBox01 dt{
	position:relative;
}

.dtBox01 dt:before{
	content:"●";
	margin-right:.5em;
	color:#023894;
}

.dtBox01 dd:not(:last-child){
	margin-bottom:1em;
}

.dtBox01 dd strong{
	color:#cc0000;
	font-weight:normal;
}

.dlList01 dt{
	font-weight:bold;
	color:#023894;
}

.dlList01 dt:before{
	content:"■";
	margin-right:.5em;
	color:#023894;
}

.dlList01 dd{
	padding-bottom:20px;
	border-bottom:1px solid #CCC;
	margin-bottom:20px;
}

.dlList01 dd .img{
	margin:10px 0 0;
	text-align:center;
}

.partner_list{
	display:flex;
	flex-wrap:wrap;
    margin-bottom:20px
}

.partner_list > li:not(:last-child){
	margin-right:20px;
}

.partner_list > li img{
	width:210px;
}


/* プライバシーポリシー
--------------------------------------------------------------- */

.privacyArea p{
	margin:0 0 1.5em;
}

.privacyArea h3{
	font-weight:bold;
}

.privacyArea ul{
	padding:0 0 0 1em;
	margin-bottom:1.5em;
}

.privacyArea li{
	list-style:disc;
	margin-left:1em;
}

.privacyArea .txtright p{
	margin-bottom:0;
}


/* 雑誌・フリーペーパー
--------------------------------------------------------------- */

.freeBox01{
	position:relative;
}

.freeBox01:after{
	position:absolute;
	top:10px;
	right:80px;
	margin:auto;
    content:" ";
    display:block;
    width:266px;
    height:180px;
	background-image:url(../img/freepaper/img1.png?id=2);   
    background-size:contain;
	line-height:1;
}


/* 汎用 - 横並び
--------------------------------------------------------------- */

.listimg1{
	width:740px;
	display:flex;
	flex-wrap: wrap;
	justify-content:center;
	align-items: center;
}

.listimg1 li{
	margin-bottom:10px;
}

.is_partner{
    position: relative;
    margin-bottom: 40px;
}

.is_partner .bnr{
    position: absolute;
    top: -8px;
    right: 0;
    width: 200px;
    padding-left: 20px;
    background: #fff;
}

.is_partner .bnr img{
    width: 100%;
    height: auto;
}


/* 各種パーツ - リスト
--------------------------------------------------------------- */

.listType1{
	padding-left:1.5em;
	list-style:disc;
	margin:1.5em 0;
}

.listType1 > li:not(:last-child){
	margin-bottom:.5em;
}


/* Youtube
--------------------------------------------------------------- */

.list-youtube-raito {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin: 2em 0;
}

.list-youtube-raito>li {
	width: 200px;
	text-align: center;
	margin: 0 20px
}

.list-youtube-raito .is-ratio {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 150px;
	height: 150px;
	border-radius: 50%;
	font-size: 2.7rem;
	font-weight: 700;
	color: #FF0000;
	background: #eee;
	margin: 0 auto 15px;
}

.list-youtube-raito .is-ratio span {
	font-size: .7em;
	margin-left: .1em;
}

.list-youtube-element {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-top: 1.5em;
}

.list-youtube-element>li {
	width: calc(33.3% - 25px);
}

.list-youtube-element dt {
	display: flex;
	justify-content: center;
	font-size: 1.3em;
	font-weight: 700;
	text-align: center;
}

.list-youtube-element dt span {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	width: 30px;
	height: 30px;
	border-radius: 15px;
	background: #023894;
	font-weight: normal;
	color: #fff;
	margin-right: .5em;
}

.list-youtube-element .img {
	text-align: center;
	margin-top: 20px;
}

.list-youtube-element .purpose {
	background: #eee;
	padding: 1em;
	text-align: center;
	margin-top: 20px;
}

.list-youtube-element .type {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	height: 70px;
	position: relative;
	font-size: 1.4em;
	text-align: center;
	background: #666;
	color: #fff;
	padding: 0 .5em;
	line-height: 1.2;
	margin-top: 20px;
}

.list-youtube-element .type span {
	font-size: .8em;
}

.list-youtube-element>li:not(:last-child) .type:after {
	position: absolute;
	top: 0;
	right: -38px;
	content: "✕";
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	color: #ff0000;
	font-weight: bold;
	width: 38px;
	height: 70px;
}

/* お知らせ文字サイズ調整
--------------------------------------------------------------- */

#contentArea.isSingle {
	font-size:16px;
}