﻿@charset "utf-8";

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

/*		Contents
---------------------------------------------------------------------------

	Common（共通部分）
	Widget・Paging・Form など（投稿一覧・共通パーツ）

	ホーム												[ / ]
	
	会社情報（固定）									[ /company/ ]
	サービス（固定）									[ /service/ ]
	お客様の声（固定）									[ /voice/ ]
	採用情報（固定）									[ /recruit/ ]
	個人情報保護方針（固定）							[ /privacy/ ]
	サイトマップ（固定）								[ /sitemap/ ]
	
	ニュース（投稿詳細）								[ /news/ ]
	講座・セミナー（投稿詳細）							[ /academy/ ]
	サポート（投稿詳細）								[ /support/ ]
	実績紹介（投稿一覧・詳細）							[ /works/ ]
	
	お問い合わせ										[ /contact/ ]
	メールアカウント追加依頼フォーム					[ /account/ ]
	24時間受付更新依頼フォーム							[ /revision/ ]
	ホームページ無料診断								[ /shindan/ ]
	レンタルサーバー/ドメイン申し込み依頼フォーム		[ /application/ ]
	配信停止											[ /cancellation/ ]
	固定ページ（1カラム）								[ /xxxx/ ]

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


/* ========================================================================
	Common
======================================================================== */
header, #contents, footer{
	width:320px;
	margin:0 auto;
	position:relative;
	font-size:1.4rem;
}

.pc{
	display:none;
}

iframe{
	width:100%;
	height:180px;
}

#overlay{
    display:none;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    z-index:99;
}


/* ----------------------------------------
	header
---------------------------------------- */
header{
	margin-bottom:-2px;
	padding:0 0 2px 0;
	background:url(../../img/common/shadow_header.png) repeat-x bottom;
	background-size:1px 2px;
	border-top:4px solid #c0153e;
	z-index:100;
}

header h1,
header p.logo{
	padding:21px 10px;
}

header h1 img,
header p.logo img{
	width:auto;
	height:30px;
}


/* navi
---------------------------------------- */
header .navi{
	margin:0 0 15px 0;
	padding:5px 10px;
	border-top:1px solid #cccccc;
	border-bottom:1px solid #cccccc;
}

header .navi li{
	position:relative;
	float:left;
	width:145px;
	padding:0 0 0 16px;
	font-size:1.0rem;
	font-weight:bold;
	line-height:20px;
}
header .navi li:nth-child(odd){ margin-right:10px; }

header .navi li::before{
	content:"";
	position:absolute;
	top:50%;
	left:0;
	margin:-3px 0 0 0;
	border-style:solid;
	border-width:3px 0 3px 6px;
	border-color:transparent transparent transparent #c0153e;
}

header .navi li a{
	text-decoration:none;
}


/* contact
---------------------------------------- */
header .contact{
	padding:0 0 10px 0;
}

header .contact .tel{
	padding:0 0 10px 0;
	text-align:center;
	font-size:1.0rem;
	font-weight:bold;
	line-height:1;
}

header .contact .tel img{
	display:block;
	width:auto;
	height:14px;
	margin:0 auto 6px;
}

header .contact .btn{
	overflow:hidden;
}

header .contact .btn p{
	float:left;
	padding:0 0 0 10px;
}

header .contact .btn p a{
	display:table-cell;
	width:145px;
	height:40px;
	background:#c0153e;
	border-radius:3px;
	text-align:center;
	vertical-align:middle;
	font-size:1.2rem;
	font-weight:bold;
	color:#ffffff;
	text-decoration:none;
}


/* nav
---------------------------------------- */
#menu p{
	position:absolute;
	top:10px;
	right:10px;
	cursor:pointer;
}

#menu ul{
	height:140px;
	position:absolute;
	bottom:-138px;
	left:0px;
	background:#c0153e;
	padding:10px;
}

#menu ul li{
	float:left;
	width:150px;
	background:#ffffff;
}

#menu ul li:first-child{
	display:none;
}

#menu ul li a{
	display:table-cell;
	width:150px;
	height:40px;
	text-align:center;
	vertical-align:middle;
	border-top:1px solid #c0153e;
	border-right:1px solid #c0153e;
	color:#333333;
	text-decoration:none;
}

#menu ul li:nth-child(-n+3) a{ border-top:none; }
#menu ul li:nth-child(odd) a{ border-right:none; }


/* ----------------------------------------
	contents
---------------------------------------- */
#contents{
	margin-bottom:-2px;
	padding:0 0 2px 0;
	background:url(../../img/common/shadow_contents.png) repeat-x bottom;
	background-size:1px 2px;
	z-index:1;
}


/* -----------------------------------
	ticker（トップページ）
----------------------------------- */
#ticker{
	position:relative;
	overflow:hidden;
	background:#f8f8f8;
	border-bottom:1px solid #ececec;
}

#ticker ul{
	overflow:visible;
}

#ticker ul li{
	display:none;
	padding:0 10px;
}

#ticker ul li span{
	margin-top:10px;
}

#ticker ul li time{
	padding:0 0 0 10px;
	vertical-align:middle;
}

#ticker ul li a{
	overflow:hidden;
	display:block;
	width:300px;
	margin:8px 0;
	color:#0555a6;
	white-space:nowrap;
	text-overflow:ellipsis;
	text-decoration:none;
}

 
/* ----------------------------------------
	title（下層ページ）
---------------------------------------- */
#title p{
	height:82px;
	padding:0 4px 0 64px;
	background:url(../../img/news/icon_title.png) no-repeat 10px center, url(../../img/news/bg_title.png) no-repeat right top;
	background-size:44px auto, auto 82px;
	font-size:2.0rem;
	font-weight:bold;
}

#title p > span{
	display:table-cell;
	height:82px;
	vertical-align:middle;
}

#title p span span{
	display:block;
	padding:4px 0 0 0;
	font-size:1.4rem;
}


/* company（会社情報）・voice（お客様の声）・privacy（個人情報保護方針）・sitemap（サイトマップ）
---------------------------------------- */
.company #title p,
.voice #title p,
.privacy #title p,
.sitemap #title p{
	padding-left:85px;
	background-image:url(../../img/company/icon_title.png), url(../../img/company/bg_title.png);
	background-size:65px auto, auto 82px;
}


/* service（サービス）
---------------------------------------- */
.service #title p{
	padding-left:57px;
	background-image:url(../../img/service/icon_title.png), url(../../img/service/bg_title.png);
	background-size:37px auto, auto 82px;
}


/* academy（講座・セミナー）
---------------------------------------- */
.academy #title p{
	padding-left:71px;
	background-image:url(../../img/academy/icon_title.png), url(../../img/academy/bg_title.png);
	background-size:51px auto, auto 82px;
}


/* support（サポート）
---------------------------------------- */
.support #title p{
	padding-left:44px;
	background-image:url(../../img/support/icon_title.png), url(../../img/support/bg_title.png);
	background-size:24px auto, auto 82px;
}


/* works（実績紹介）
---------------------------------------- */
.works #title p{
	padding-left:71px;
	background-image:url(../../img/works/icon_title.png), url(../../img/works/bg_title.png);
	background-size:51px auto, auto 82px;
}


/* contact（お問い合わせ）
---------------------------------------- */
.contact #title p{
	padding-left:57px;
	background-image:url(../../img/contact/icon_title.png), url(../../img/contact/bg_title.png);
	background-size:37px auto, auto 82px;
}


/* account（メールアカウント追加依頼フォーム）
---------------------------------------- */
.account #title p{
	padding-left:62px;
	background-image:url(../../img/account/icon_title.png), url(../../img/account/bg_title.png);
	background-size:42px auto, auto 82px;
}

/* account（メールアカウント削除依頼フォーム）
---------------------------------------- */
.accountdel #title p{
	padding-left:62px;
	background-image:url(../../img/accountdel/icon_title.png), url(../../img/accountdel/bg_title.png);
	background-size:42px auto, auto 82px;
}


/* revision（24時間受付更新依頼フォーム）
---------------------------------------- */
.revision #title p{
	padding-left:55px;
	background-image:url(../../img/revision/icon_title.png), url(../../img/revision/bg_title.png);
	background-size:35px auto, auto 82px;
}


/* shindan（ホームページ無料診断）
---------------------------------------- */
.shindan #title p{
	padding-left:56px;
	background-image:url(../../img/shindan/icon_title.png), url(../../img/shindan/bg_title.png);
	background-size:36px auto, auto 82px;
}


/* application（レンタルサーバー/ドメイン申し込み依頼フォーム）
---------------------------------------- */
.application #title p{
	padding-left:56px;
	background-image:url(../../img/application/icon_title.png), url(../../img/application/bg_title.png);
	background-size:36px auto, auto 82px;
}


/* ----------------------------------------
	path
---------------------------------------- */
#path{
	margin:0 0 20px 0;
	padding:4px 10px;
	background:#f8f8f8;
	border-bottom:1px solid #ececec;
}

#path ol li{
	float:left;
	padding:0 0.5em 0 0;
	font-size:1.2rem;
	line-height:2;
}

#path ol li:first-child{
	padding-left:20px;
	background:url(../../img/common/icon_home.png) no-repeat left center;
	background-size:10px auto;
}

#path ol li::after{
	content:">";
	padding:0 0 0 0.5em;
}

#path ol li:last-child::after{
	content:"";
	padding:0;
}

#path ol li a{
	color:#0555a6;
	text-decoration:none;
}


/* ----------------------------------------
	aside
---------------------------------------- */
#contents aside a{ text-decoration:none; }

aside h2{
	position:relative;
	margin:0 0 10px 0;
	background:#e5813f;
	text-align:center;
	font-weight:bold;
	color:#ffffff;
	line-height:40px;
}

aside h2::before{
	content:"";
	position:absolute;
	bottom:-8px;
	left:50%;
	margin:0 0 0 -7px;
	border-style:solid;
	border-width:8px 7px 0 7px;
	border-color:#e5813f transparent transparent transparent;
}

aside ul li{
	border-bottom:1px solid #ececec;
}

aside ul li:last-child,
aside .children li{
	border-bottom:none;
}

aside ul li a{
	display:block;
	padding:0 10px 0 32px;
	background:url(../../img/news/arrow.png) no-repeat 12px center;
	background-size:10px auto;
	font-weight:bold;
	line-height:40px;
}

aside .children a{
	position:relative;
	padding-left:46px;
	background:none !important;
	border-top:1px solid #ececec;
	border-bottom:none;
}

aside .children a::before{
	content:"";
	position:absolute;
	top:50%;
	left:32px;
	margin:-4px 0 0 0;
	border-style:solid;
	border-width:4px 0 4px 4px;
	border-color:transparent transparent transparent #e5813f;
}


/* privacy（個人情報保護方針）・sitemap（サイトマップ）
---------------------------------------- */
.privacy aside, .sitemap aside{ display:none; }


/* company（会社情報）・voice（お客様の声）
---------------------------------------- */
.company aside h2,
.voice aside h2{ background:#3f90d5; }
.company aside h2::before,
.voice aside h2::before{ border-top-color:#3f90d5; }
.company aside ul li a,
.voice aside ul li a{ background-image:url(../../img/company/arrow.png); }
.company aside .children a::before,
.voice aside .children a::before{ border-left-color:#3f90d5;}


/* service（サービス）
---------------------------------------- */
.service aside h2{ background:#f35769; }
.service aside h2::before{ border-top-color:#f35769; }
.service aside ul li a{ background-image:url(../../img/service/arrow.png); }
.service aside .children a::before{ border-left-color:#f35769;}


/* academy（講座・セミナー）
---------------------------------------- */
.academy aside h2{ background:#308dc8; }
.academy aside h2::before{ border-top-color:#308dc8; }
.academy aside ul li a{ background-image:url(../../img/academy/arrow.png); }


/* support（サポート）
---------------------------------------- */
.support aside h2{ background:#54c9b6; }
.support aside h2::before{ border-top-color:#54c9b6; }
.support aside ul li a{ background-image:url(../../img/support/arrow.png); }


/* works（実績紹介）
---------------------------------------- */
.works aside h2{ background:#7db554; }
.works aside h2::before{ border-top-color:#7db554; }
.works aside ul li a{ background-image:url(../../img/works/arrow.png); }

.works aside section{
	padding:0 0 2px 0;
}

.works aside section section{
	padding:2px 0 0 0;
}

.works aside h3{
	background:url(../../img/works/icon_open.png) no-repeat 12px center #ececec;
	background-size:10px auto;
	text-align:center;
	font-weight:bold;
	color:#7db554;
	line-height:35px;
	cursor:pointer;
}

.works aside h3.close{
	background-image:url(../../img/works/icon_close.png);
}

.works aside ul{
	display:none;
	margin:0 0 -3px 0;
}


/* ----------------------------------------
	footer
---------------------------------------- */
footer{
	text-align:center;
}

footer .pagetop{
	display:none !important;
}

footer .copyright{
	padding:10px 0;
	font-size:1.0rem;
}


/* contact
---------------------------------------- */
footer .contact{
	position:relative;
	background:#c0153e;
}

footer .contact::before{
	content:"";
	position:absolute;
	top:0;
	left:10px;
	width:174px;
	height:173px;
	background:url(../../img/common/bg_contact.png) no-repeat left top;
	background-size:174px 173px;
}

footer .contact > *{
	position:relative;
	z-index:1;
}

footer .contact dt{
	padding:20px 10px;
	font-size:1.8rem;
	font-weight:bold;
	color:#ffffff;
}

footer .contact dd:last-of-type{
	padding:20px 10px;
	font-size:1.2rem;
	color:#ffffff;
	line-height:1.5;
}

footer .contact dd a{
	color:#ffffff;
}

footer .contact dd address{
	padding:0 10px;
}

footer .contact dd address > span{
	display:block;
}

footer .contact dd address .tel{
	padding:0 0 10px 0;
	font-size:1.2rem;
	font-weight:bold;
	color:#ffffff;
}

footer .contact dd address .tel img{
	display:block;
	width:200px;
	margin:0 auto 6px;
}

footer .contact dd address .btn a{
	display:inline-block;
	width:240px;
	background:-webkit-linear-gradient(top,  #ffffff 0%,#dfdfde 100%);
	background:linear-gradient(to bottom,  #ffffff 0%,#dfdfde 100%);
	filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dfdfde',GradientType=0 ); /* IE9用 */
	border:2px solid #ffffff;
	border-radius:3px;
	box-shadow:3px 3px 3px rgba(151,24,45,0.5);
	font-size:1.6rem;
	font-weight:bold;
	color:#bc0f40;
	line-height:36px;
	text-decoration:none;
}


/* menu
---------------------------------------- */
footer .menu ul{
	padding:10px;
	background:#242424;
}

footer .menu ul li{
	float:left;
	width:150px;
}

footer .menu ul li a{
	display:block;
	background:#ffffff;
	border-top:1px solid #242424;
	border-right:1px solid #242424;
	font-size:1.2rem;
	line-height:32px;
	text-decoration:none;
}

footer .menu ul li:nth-child(-n+2) a{ border-top:none; }
footer .menu ul li:nth-child(2n) a{ border-right:none; }


/* navi
---------------------------------------- */
footer .navi{
	padding:10px;
	border-bottom:1px solid #cccccc;
	font-size:0;
}

footer .navi li{
	position:relative;
	display:inline-block;
	margin:0 10px;
	padding:0 0 0 12px;
	font-size:1.0rem;
	font-weight:bold;
}

footer .navi li::before{
	content:"";
	position:absolute;
	top:50%;
	left:0;
	margin:-3px 0 0 0;
	border-style:solid;
	border-width:3px 0 3px 6px;
	border-color:transparent transparent transparent #c0153e;
}

footer .navi li a{
	text-decoration:none;
}


/* ========================================================================
	Widget・Paging・Form など（投稿一覧・共通パーツ）
======================================================================== */

/* ----------------------------------------
	widget_list（投稿一覧）
---------------------------------------- */
.widget_list li{
	float:left;
	width:145px;
	margin:0 0 20px 10px;
	line-height:1.5;
}

.widget_list li:nth-child(3n){
	margin-right:0;
}

.widget_list li a{
	display:block;
	color:#0555a6;
	text-decoration:none;
}

.widget_list li img{
	margin:0 0 10px 0;
}

.widget_list li span{
	display:block;
	margin:0 0 10px 0;
	padding:0;
}

.widget_list li time{
	display:block;
	padding:0 0 6px 0;
}


/* ----------------------------------------
	cat（カテゴリ）
---------------------------------------- */
.cat{
	display:inline-block;
	min-width:80px;
	padding:0 10px;
	background:#66b016;
	border-radius:2px;
	text-align:center;
	font-size:1.2rem;
	color:#ffffff;
	line-height:22px;
}

.cat.recruit{ background:#207eba; }


/* ----------------------------------------
	back（投稿詳細・戻るボタン）
---------------------------------------- */
.back{
	padding:20px 0;
	border-top:1px solid #ececec;
	text-align:center;
}

.back a{
	display:inline-block;
	width:190px;
	border:1px solid #e5813f;
	border-radius:3px;
	font-weight:bold;
	color:#e5813f;
	line-height:40px;
	text-decoration:none;
}


/* academy（講座・セミナー）
---------------------------------------- */
.academy .back a{ border-color:#308dc8; color:#308dc8; }


/* support（サポート）
---------------------------------------- */
.support .back a{ border-color:#2cbba5; color:#2cbba5; }


/* works（実績紹介）
---------------------------------------- */
.works .back a{ border-color:#7db554; color:#7db554; }


/* -----------------------------------
	paging
----------------------------------- */
.paging{
	padding:20px 0 10px 0;
	border-top:1px solid #ececec;
	text-align:center;
	font-size:1.2rem;
}

.paging span{
	display:inline-block;
	padding:0 4px 10px;
	vertical-align:bottom;
}

.paging span.current{
	width:30px;
	line-height:28px;
	margin:0 4px 10px;
	padding:0;
	background:#e5813f;
	border:1px solid #e5813f;
	border-radius:2px;
	text-align:center;
	color:#ffffff;
}

.paging a{
	display:inline-block;
	width:30px;
	line-height:28px;
	margin:0 4px 10px;
	border:1px solid #e5813f;
	border-radius:2px;
	text-align:center;
	color:#e5813f;
	text-decoration:none;
}

.paging a.prev,
.paging a.next{
	width:auto;
	padding:0 8px;
}


/* academy（講座・セミナー）
---------------------------------------- */
.academy .paging span.current{ background:#308dc8; border-color:#308dc8; }
.academy .paging a{ border-color:#308dc8; color:#308dc8; }


/* support（サポート）
---------------------------------------- */
.support .paging span.current{ background:#2cbba5; border-color:#2cbba5; }
.support .paging a{ border-color:#2cbba5; color:#2cbba5; }


/* works（サポート）
---------------------------------------- */
.works .paging span.current{ background:#7db554; border-color:#7db554; }
.works .paging a{ border-color:#7db554; color:#7db554; }


/* -----------------------------------
	form
----------------------------------- */
form table{
	margin:0 0 20px 0;
	border-top:1px dashed #8b9297;
	line-height:1.5;
}

form table th{
	display:block;
	padding:10px;
	background:#f1f1f1;
	border-bottom:1px dashed #8b9297;
	text-align:left;
	font-weight:bold;
}

form table th span{
	display:inline-block;
	margin:0 0 0 10px;
	padding:0 10px;
	background:#c0153e;
	border-radius:3px;
	font-size:1.2rem;
	color:#ffffff;
	line-height:20px;
}

form table td{
	display:block;
	padding:5px 10px;
	border-bottom:1px dashed #8b9297;
}


/* input
---------------------------------------- */
form input[type="text"],
form input[type="tel"],
form input[type="email"],
form textarea{
	width:100%;
	height:34px;
	margin:5px 0;
	padding:0 10px;
	background:#f1f1f1;
	border:none;
	border-radius:3px;
}

form textarea{
	height:auto;
	padding:10px;
	line-height:1.5;
}

form label{
	display:block;
	margin:10px 0;
}

form input[type="radio"],
form input[type="checkbox"]{
	margin:-2px 12px 0 0;
}

form input[disabled]{
	background:#999999;
}


/* btn
---------------------------------------- */
form .btn{
	text-align:center;
}

form .btn button{
	width:250px;
	height:50px;
	background:url(../../img/common/arrow_form.png) no-repeat 224px center #c0153e;
	border:none;
	font-size:1.8rem;
	font-weight:bold;
	color:#ffffff;
	letter-spacing:2px;
}

/* btn 追加
---------------------------------------- */
div .c_btn{
	text-align:center;
}

.c_btn .btn{
	display: inline-block;
	text-decoration: none;
	width:250px;
	height:50px;
	background:url(../../img/common/arrow_form2.png) no-repeat 224px center #f35769;
	border:none;
	font-size:1.8rem;
	font-weight:bold;
	color:#ffffff;
	padding-top: 5%;
	margin: 8px 0 35px 0;
	letter-spacing:2px;
}	

/* ========================================================================
	ホーム												[ / ]
======================================================================== */
#home > section > h2{
	position:relative;
	margin:0 0 30px 0;
	text-align:center;
	font-weight:bold;
}

#home > section > h2::before{
	content:"";
	position:absolute;
	bottom:-6px;
	left:50%;
	margin:0 0 0 -5px;
	border-style:solid;
	border-width:6px 5px 0 5px;
	border-color:#c0153e transparent transparent transparent;
}

#home > section > h2 span{
	display:inline-block;
	padding:0 0 12px 0;
	border-bottom:3px solid #c0153e;
	text-align:center;
}

#home > section > h2 img{
	display:block;
	width:auto;
	height:17px;
	margin:0 auto 10px;
}


/* ----------------------------------------
	btn（共通ボタン）
---------------------------------------- */
#home .btn a{
	display:block;
	width:300px;
	margin:0 auto;
	background:url(../../img/home/arrow.png) no-repeat 284px center;
	background-size:4px 6px;
	border:1px solid #c0153e;
	border-radius:2px;
	text-align:center;
	font-weight:bold;
	color:#c0153e;
	line-height:33px;
	text-decoration:none;
}


/* ----------------------------------------
	service
---------------------------------------- */
#home .service{
	padding:30px 10px 0;
}

#home .service p{
	padding:0 0 20px 0;
	text-align:center;
	line-height:2;
}

#home .service > ul > li{
	padding:0 0 30px 0;
}

#home .service h3 a{
	display:block;
	padding:20px 0;
	background:#f8f8f8;
	border:5px solid #f1f1f1;
	text-align:center;
	font-size:2.0rem;
	font-weight:bold;
	color:#c0153e;
	text-decoration:none;
}

#home .service h3 img{
	display:block;
	width:auto;
	height:43px;
	margin:10px auto 0;
}

#home .service dl{
	padding:14px 10px;
}

#home .service dl dt{
	padding:0 0 6px 0;
	font-size:1.6rem;
	font-weight:bold;
	line-height:1.5;
}

#home .service dl dd ul li{
	padding-left:1.5em;
	text-indent:-1.5em;
	line-height:1.571;
}

#home .service dl dd ul li::before{
	content:"●";
	padding:0 0.5em 0 0;
	color:#c0153e;
}


/* ----------------------------------------
	works
---------------------------------------- */
#home .works{
	padding:30px 0;
	background:#f8f8f8;
	text-align:center;
}

#home .works p{
	padding:0 10px 10px;
	font-size:1.2rem;
	line-height:2;
}

#home .works p:last-of-type{
	padding-bottom:20px;
}

#home .works p.lead{
	padding-bottom:20px;
	font-size:1.4rem;
}

#home .works p.lead span{
	display:inline-block;
	padding:0 2px 0 6px;
	background:#ffef3d;
	font-size:2.0rem;
	font-weight:bold;
	line-height:1.2;
}


/* slider
---------------------------------------- */
#slider li{
	width:180px !important;
	margin:0 20px 0 0;
	line-height:1.5;
}

#slider li a{
	color:#0555a6;
	text-decoration:none;
}

#slider li span{
	overflow:hidden;
	display:block;
	width:180px;
	height:129px;
	margin:0 0 10px 0;
}

#slider li img{
	width:180px;
}


/* ----------------------------------------
	voice
---------------------------------------- */
#home .voice{
	padding:30px 10px 0;
}

#home .voice p{
	padding:0 0 20px 0;
	text-align:center;
	line-height:2;
}

#home .voice ul li{
	padding:0 0 30px 0;
}

#home .voice dl dt{
	padding:0 0 6px 0;
	text-align:center;
	font-size:1.6rem;
	font-weight:bold;
	line-height:1.5;
}

#home .voice dl dt img{
	display:block;
	margin:0 0 14px 0;
}

#home .voice dl dd{
	padding:0 0 10px 0;
	line-height:2;
}


/* ----------------------------------------
	division
---------------------------------------- */
#home .division{
	padding:20px 0 10px 0;
	background:#f8f8f8;
}

#home .division h2{
	position:relative;
	padding:0 10px 10px 27px;
	font-size:1.6rem;
	font-weight:bold;
	color:#c0153e;
	line-height:24px;
}

#home .division h2::before{
	content:"";
	position:absolute;
	top:0;
	left:10px;
	width:7px;
	height:24px;
	background:#c0153e;
	border-radius:2px;
}


/* bnr
---------------------------------------- */
#home .bnr ul li{
	float:left;
	width:145px;
	margin:0 0 10px 10px;
}
#home .bnr ul li:first-child{ width:300px; }


/* ========================================================================
	会社情報（固定）									[ /company/ ]
	サービス（固定）									[ /service/ ]
	お客様の声（固定）									[ /voice/ ]
	採用情報（固定）									[ /recruit/ ]
	個人情報保護方針（固定）							[ /privacy/ ]
	サイトマップ（固定）								[ /sitemap/ ]
	
	ニュース（投稿詳細）								[ /news/ ]
	講座・セミナー（投稿詳細）							[ /academy/ ]
	サポート（投稿詳細）								[ /support/ ]
======================================================================== */
#page{
	padding:0 0 10px 0;
}


/* ----------------------------------------
	見出し
---------------------------------------- */
#page h1{
	position:relative;
	margin:0 10px 20px;
	padding:0 0 0 17px;
	font-size:2.0rem;
	font-weight:bold;
	color:#e5813f;
	line-height:30px;
}

#page h1::before{
	content:"";
	position:absolute;
	top:0;
	left:0;
	width:7px;
	height:30px;
	background:#e5813f;
	border-radius:2px;
}

#page h2{
	margin:0 0 20px 0;
	padding:5px 10px;
	background:#e5813f;
	font-size:1.6rem;
	font-weight:bold;
	color:#ffffff;
	line-height:1.5;
}

#page h3{
	margin:0 0 20px 0;
	padding:6px 10px;
	background:#f1f1f1;
	font-weight:bold;
	color:#e5813f;
	line-height:1.5;
}

#page h4{
	margin:0 0 20px 0;
	padding:0 10px 10px;
	border-bottom:2px solid #e5813f;
	font-weight:bold;
	color:#e5813f;
}


/* company（会社情報）・voice（お客様の声）・privacy（個人情報保護方針）・sitemap（サイトマップ）
---------------------------------------- */
.company #page h1, .company #page h3,
.voice #page h1, .voice #page h3,
.privacy #page h1, .privacy #page h3,
.sitemap #page h1{ color:#3f90d5; }

.company #page h1::before, .company #page h2,
.voice #page h1::before, .voice #page h2,
.privacy #page h1::before, .privacy #page h2,
.sitemap #page h1::before{ background-color:#3f90d5; }

.company #page h4,
.voice #page h4,
.privacy #page h4{ border-color:#3f90d5; color:#3f90d5; }


/* service（サービス）
---------------------------------------- */
.service #page h1, .service #page h3{ color:#f35769; }
.service #page h1::before, .service #page h2{ background-color:#f35769; }
.service #page h4{ border-color:#f35769; color:#f35769; }


/* academy（講座・セミナー）
---------------------------------------- */
.academy #page h1, .academy #page h3{ color:#308dc8; }
.academy #page h1::before, .academy #page h2{ background-color:#308dc8; }
.academy #page h4{ border-color:#308dc8; color:#308dc8; }


/* support（サポート）
---------------------------------------- */
.support #page h1, .support #page h3{ color:#54c9b6; }
.support #page h1::before, .support #page h2{ background-color:#54c9b6; }
.support #page h4{ border-color:#54c9b6; color:#54c9b6; }


/* ----------------------------------------
	navi（固定一覧）
---------------------------------------- */
#page .navi{
	padding:0 10px;
}

#page .navi li{
	margin:0 0 20px 0;
}

#page .navi li a{
	text-decoration:none;
}

#page .navi li img{
	margin:0 0 10px 0;
	border-bottom:3px solid #3f90d5;
	border-top-left-radius:5px;
	border-top-right-radius:5px;
}

#page .navi li p{
	line-height:2;
}

#page .navi li p.title{
	margin:0;
	padding:0 0 0 20px;
	background:url(../../img/company/arrow.png) no-repeat left center;
	background-size:10px auto;
	font-size:1.4rem;
	color:#3f90d5;
}


/* service（サービス）
---------------------------------------- */
.service #page .navi li img{ border-color:#f35769; }
.service #page .navi li p.title{ background-image:url(../../img/service/arrow.png); color:#f35769; }


/* -----------------------------------
	date（投稿詳細）
----------------------------------- */
#page p.date{
	padding:0 10px 10px;
}

#page p.date .cat{
	margin:0 10px 10px 0;
}

#page p.date time{
	display:inline-block;
	margin:0 0 10px 0;
	line-height:22px;
}


/* ----------------------------------------
	entry
---------------------------------------- */
#page .entry p{
	overflow:hidden;
	padding:0 10px 20px;
	line-height:2;
}

#page .entry span.lead{
	font-weight:bold;
	color:#e5813f;
	line-height:1.5;
}

#page .entry table{
	width:100% !important;
	margin:0 0 30px 0;
	border-top:1px solid #e4e4e4;
}

#page .entry table td{
	display:block;
	width:100% !important;
	height:auto !important;
	padding:10px;
	border-bottom:1px solid #e4e4e4;
	line-height:1.5;
}

#page .entry table td:first-of-type{
	background:#f1f1f1;
	font-weight:bold;
}

#page .entry table td p{
	padding:0 0 20px 0;
	line-height:1.5;
}

#page .entry table td p:last-of-type{
	padding:0;
}

#page .entry .aligncenter,
#page .entry .alignright,
#page .entry .alignleft{
	display:block;
	margin:0 auto;
	text-align:center;
}

#page .entry .aligncenter img,
#page .entry .alignright img,
#page .entry .alignleft img{
	margin:0 0 10px 0;
}


/* company（会社情報）・voice（お客様の声）
---------------------------------------- */
.company #page .entry span.lead,
.voice #page .entry span.lead{ color:#3f90d5; }


/* service（サービス）
---------------------------------------- */
.service #page .entry span.lead{ color:#f35769; }


/* academy（講座・セミナー）
---------------------------------------- */
.academy #page .entry span.lead{ color:#308dc8; }


/* support（サポート）
---------------------------------------- */
.support #page .entry span.lead{ color:#54c9b6; }


/* ----------------------------------------
	sitemap（サイトマップ）
---------------------------------------- */
#page .sitemap{
	padding:0 10px 5px;
}

#page .sitemap ul li{
	margin:0 0 14px 0;
	padding:0 0 0 20px;
	background:url(../../img/company/arrow.png) no-repeat left center;
	background-size:10px auto;
}

#page .sitemap ul li a{
	text-decoration:none;
}


/* ========================================================================
	実績紹介（投稿一覧・詳細）							[ /works/ ]
======================================================================== */
#works{
	padding:0 0 10px 0;
}

#works h1{
	position:relative;
	margin:0 10px 20px;
	padding:0 0 0 17px;
	font-size:2.0rem;
	font-weight:bold;
	color:#7db554;
	line-height:30px;
}

#works h1::before{
	content:"";
	position:absolute;
	top:0;
	left:0;
	width:7px;
	height:34px;
	background:#7db554;
	border-radius:2px;
}

#works p{
	line-height:2;
}


/* ----------------------------------------
	description（カテゴリ説明文）
---------------------------------------- */
#works .description h2{
	margin:0 0 20px 0;
	padding:5px 10px;
	background:#7db554;
	font-size:1.6rem;
	font-weight:bold;
	color:#ffffff;
	line-height:1.5;
}

#works .description h3{
	margin:0 0 20px 0;
	padding:6px 10px;
	background:#f1f1f1;
	font-weight:bold;
	color:#7db554;
	line-height:1.5;
}

#works .description h4{
	margin:0 0 20px 0;
	padding:0 10px 10px;
	border-bottom:2px solid #7db554;
	font-weight:bold;
	color:#7db554;
}

#works .description p{
	padding:0 10px 20px;
}


/* ----------------------------------------
	ul（一覧）
---------------------------------------- */
#works ul li{
	float:left;
	width:145px;
	margin:0 0 20px 10px;
	text-align:center;
	vertical-align:top;
	line-height:1.5;
}

#works ul li a{
	display:block;
	color:#0555a6;
	text-decoration:none;
}

#works ul li span{
	overflow:hidden;
	display:block;
	width:145px;
	height:104px;
	margin:0 0 10px 0;
}


/* ----------------------------------------
	section（詳細）
---------------------------------------- */
#works p.key{
	padding:0 10px 20px;
	text-align:center;
}

#works table{
	margin:0 0 20px 0;
	background:#f8f8f8;
	border-top:20px solid #f8f8f8;
	text-align:left;
	line-height:1.5;
}

#works table th{
	display:block;
	padding:0 10px;
	font-weight:bold;
}

#works table td{
	display:block;
	padding:0 10px 20px;
}

#works table td span{
	display:inline-block;
	padding:0 1em 0 0;
}

#works table td a{
	display:block;
	padding:0 0 0 20px;
	background:url(../../img/works/icon_blank.png) no-repeat left center;
	background-size:10px auto;
	color:#0555a6;
	text-decoration:none;
}


/* introduction
---------------------------------------- */
#works .introduction{
	padding:0 10px 20px;
}

#works .introduction h2{
	padding:0 0 10px 0;
	font-size:2.0rem;
	font-weight:bold;
	color:#7db554;
}


/* ========================================================================
	お問い合わせ										[ /contact/ ]
	メールアカウント追加依頼フォーム					[ /account/ ]
	24時間受付更新依頼フォーム							[ /revision/ ]
	ホームページ無料診断								[ /shindan/ ]
	レンタルサーバー/ドメイン申し込み依頼フォーム		[ /application/ ]
	配信停止											[ /cancellation/ ]
======================================================================== */
#contents #form{
	padding:0 0 30px 0;
}

#form h1{
	position:relative;
	margin:0 10px 20px;
	padding:0 0 0 17px;
	font-size:2.0rem;
	font-weight:bold;
	color:#c0153e;
	line-height:30px;
}

#form h1::before{
	content:"";
	position:absolute;
	top:0;
	left:0;
	width:7px;
	height:30px;
	background:#c0153e;
	border-radius:2px;
}

#form h2{
	margin:0 0 20px 0;
	padding:5px 10px;
	background:#c0153e;
	font-size:1.6rem;
	font-weight:bold;
	color:#ffffff;
	line-height:1.5;
}

#form p{
	padding:0 10px 20px;
	line-height:2;
}

#form p.lead{
	padding-bottom:10px;
	font-weight:bold;
}


/* ----------------------------------------
	tel（お問い合わせ）
---------------------------------------- */
#form .tel{
	padding:0 10px 10px;
	text-align:center;
}

#form .tel p{
	padding:0 0 10px 0;
	font-weight:bold;
	line-height:1.2;
}

#form .tel p span{
	color:#c0153e;
}

#form .tel p img{
	width:230px;
}


/* ----------------------------------------
	step
---------------------------------------- */
#form .step{
	padding:0 0 16px 0;
}

#form .step li{
	margin:0 0 4px 0;
	background:#f8f8f8;
	text-align:center;
	font-size:1.4rem;
	line-height:30px;
}

#form .step li span{
	padding:0 1em 0 0;
	font-weight:bold;
}

#form .step li.current{
	background:#c0153e;
	color:#ffffff;
}


/* ----------------------------------------
	about_shindan（ホームページ無料診断）
---------------------------------------- */
#form .about_shindan{
	padding:0 0 10px 0;
}

#form .about_shindan p{
	padding:0 0 20px 0;
}


/* ----------------------------------------
	step_shindan（ホームページ無料診断）
---------------------------------------- */
#form .step_shindan{
	padding:0 0 30px 0;
}

#form .step_shindan ol{
	padding:20px 20px 0;
	background:#fcf9f2;
}

#form .step_shindan ol li{
	padding:0 0 20px 0;
}

#form .step_shindan dl dd{
	overflow:hidden;
	padding:10px 0 0;
	line-height:2;
}

#form .step_shindan dl dd img{
	float:right;
	width:100px;
	margin:0 0 0 10px;
}


/* ----------------------------------------
	rule（レンタルサーバー/ドメイン申し込み依頼フォーム）
---------------------------------------- */
#form .rule h2{
	margin:0;
	padding:0 10px 15px;
	background:none;
	text-align:center;
	font-size:2.0rem;
	font-weight:normal;
	color:#c0153e;
}

#form .rule p{
	text-align:center;
	font-weight:bold;
}

#form .rule p label{
	margin:0;
}

#form .rule dl{
	overflow-y:scroll;
	height:160px;
	margin:0 10px 20px;
	padding:10px 10px 0;
	border:1px solid #8b9297;
	font-size:1.2rem;
	line-height:1.8;
}

/* ---------- scrollbar ---------- */
#form .rule dl::-webkit-scrollbar{width:10px;}
#form .rule dl::-webkit-scrollbar-track{background:#f1f1f1;}
#form .rule dl::-webkit-scrollbar-thumb{background:#c1c1c1;}
/* ------------------------------ */

#form .rule dl dt,
#form .rule dl dd{
	padding:0 0 10px 0;
}


/* ========================================================================
	固定ページ（1カラム）								[ /xxxx/ ]
======================================================================== */
#column1{
	padding:0 0 10px 0;
}


/* ----------------------------------------
	見出し
---------------------------------------- */
#column1 h1{
	padding:0 10px 20px;
	text-align:center;
	font-size:2.0rem;
	color:#f35769;
	line-height:30px;
}

#column1 h2{
	margin:0 0 20px 0;
	padding:0 0 10px 0;
	border-bottom:1px solid #f35769;
	text-align:center;
	font-size:1.8rem;
	line-height:28px;
}

#column1 h3{
	margin:0 0 20px 0;
	padding:10px;
	background:#f35769;
	text-align:center;
	font-size:1.6rem;
	font-weight:bold;
	color:#ffffff;
	line-height:26px;
}

#column1 h4{
	position:relative;
	padding:0 0 20px 16px;
	font-weight:bold;
	line-height:24px;
}

#column1 h4::before{
	content:"";
	position:absolute;
	top:0;
	left:0;
	width:6px;
	height:24px;
	background:#f35769;
	border-radius:3px;
}


/* ----------------------------------------
	navi（固定一覧）
---------------------------------------- */
#column1 .navi{
	padding:0 10px;
}

#column1 .navi li{
	padding:0 0 20px 0;
}

#column1 .navi li a{
	text-decoration:none;
}

#column1 .navi li img{
	margin:0 0 10px 0;
}

#column1 .navi li p{
	line-height:2;
}

#column1 .navi li p.title{
	font-weight:bold;
	color:#f35769;
}


/* ----------------------------------------
	entry
---------------------------------------- */
#column1 .entry{
	padding:0 10px;
}

#column1 .entry p{
	padding:0 0 20px 0;
	line-height:2;
}

#column1 .entry ul{
	padding:0 0 20px 0;
}

#column1 .entry ul li{
	padding:10px 0;
	border-bottom:1px dashed #cbcbcb;
	line-height:2;
}
#column1 .entry ul li:first-child{ padding-top:0; }

#column1 .entry table{
	width:100% !important;
	margin:0 0 20px 0;
	border-top:1px solid #cbcbcb;
	line-height:2;
}

#column1 .entry table th{
	display:block;
	width:auto !important;
	padding:10px;
	background:#f1f1f1;
	border:1px solid #cbcbcb;
	border-top:none;
	text-align:center;
	font-weight:bold;
}

#column1 .entry table td{
	display:block;
	width:auto !important;
	padding:10px;
	border:1px solid #cbcbcb;
	border-top:none;
}

#column1 .entry .aligncenter,
#column1 .entry .alignright,
#column1 .entry .alignleft{
	display:block;
	margin:0 auto 10px;
}


/* column2 / column3
---------------------------------------- */
#column1 .block,
#column1 .block p{
	padding:0 0 10px 0;
}

#column1 .block p.title{
	font-size:1.6rem;
	font-weight:bold;
	color:#f35769;
	line-height:26px;
}

#column1 .block .aligncenter,
#column1 .block .alignright,
#column1 .block .alignleft{
	margin-bottom:0;
}


/* link
---------------------------------------- */
#column1 .link{
	padding:0 0 20px 0;
}

#column1 .link a{
	display:block;
	padding:10px 20px;
	border:3px solid #f35769;
	border-radius:37px;
	text-align:center;
	font-size:1.6rem;
	font-weight:bold;
	color:#f35769;
	line-height:24px;
	text-decoration:none;
	transition-duration:0.2s;
}

#column1 .link a:hover{
	background:#f35769;
	color:#ffffff;
}

/* ========================================================================
	固定ページ（1カラム）	お問い合わせ							[ /xxxx/ ]
======================================================================== */
#contents #contact_contents{
	padding:0 0 50px 0;
}

/* ----------------------------------------
	見出し
---------------------------------------- */
#contact_contents h1{
	padding:0 10px 20px;
	text-align:center;
	font-family:"游明朝", YuMincho, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "メイリオ", Meiryo, sans-serif;
	font-size:2.0rem;
	color:#f35769;
	line-height:30px;
}

#contact_contents h2{
	margin:0 0 20px 0;
	padding:0 0 10px 0;
	border-bottom:1px solid #f35769;
	text-align:center;
	font-family:"游明朝", YuMincho, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "メイリオ", Meiryo, sans-serif;
	font-size:1.8rem;
	line-height:28px;
}

#contact_contents h3{
	margin:0 0 20px 0;
	padding:10px;
	background:#f35769;
	text-align:center;
	font-size:1.6rem;
	font-weight:bold;
	color:#ffffff;
	line-height:26px;
}

#contact_contents h4{
	position:relative;
	padding:0 0 20px 16px;
	font-weight:bold;
	line-height:24px;
}

#contact_contents h4::before{
	content:"";
	position:absolute;
	top:0;
	left:0;
	width:6px;
	height:24px;
	background:#f35769;
	border-radius:3px;
}
#contact_contents .contact_form_style table{
width:90%;
text-align:left;
font-weight:bold;
overflow:auto;
white-space: wrap;
	margin: 0 auto;
border-top:none;	
border-bottom:solid 1px #e8e8e8;	
	table-layout: auto;
} 
/*見出しセル指定*/
#contact_contents .contact_form_style table th{
	display: block;
	width: 100%;
background:#f7f7f7;
border:solid 1px #e8e8e8;
	border-bottom: none;
padding:10px;
} 
#contact_contents .contact_form_style table th span{
	display:inline-block;
	margin:0px;

	background:none;
	border-radius:none;
	color:#121212;
	line-height:1.4;
}	
		
/*見出し以外のセル指定*/
#contact_contents .contact_form_style table td{
	display: block;
	width: 100%;
padding:10px;
border:solid 1px #e8e8e8;
	border-bottom: none;
font-size:16px;
background:#fff;
	text-align: left;
}
/*行の枠線*/
#contact_contents .contact_form_style table tr{
border:none;
} 
/* input
---------------------------------------- */
#contact_contents .contact_form_style form input[type="text"],
#contact_contents .contact_form_style form input[type="tel"],
#contact_contents .contact_form_style form input[type="email"],
#contact_contents .contact_form_style form input[type="number"],
#contact_contents .contact_form_style form input[type="date"],
#contact_contents .contact_form_style form textarea{
	width:100% !important;
	height:40px;
	margin:5px 0;
	padding:0 10px;
	background:#fff;
	border:3px solid #d5d5d5;
	border-radius:3px;
}

#contact_contents .contact_form_style form textarea{
	height:auto;
	padding:10px;
	line-height:1.5;
}

#contact_contents .contact_form_style form label{
	display:inline-block;
	min-width:auto;
	margin:5px 1em 0 0;
}

#contact_contents .contact_form_style form label:nth-of-type(odd){
	min-width:auto;
}

#contact_contents .contact_form_style form input[type="radio"],
#contact_contents .contact_form_style form input[type="checkbox"]{
	margin:-2px 5px 0 0;
}

#contact_contents .contact_form_style form input[disabled]{
	background:#cccccc;
}

/*必須の調整*/
#contact_contents .contact_form_style .haveto{
 font-size:12px;
 padding:2px 10px;
 background:#ff9393;
 color:#fff;
 border-radius:2px;
 margin-right:5px;
 position:relative;
 bottom:1px;
}
/*任意の調整*/
#contact_contents .contact_form_style .any{
 font-size:12px;
 padding:2px 10px;
 background:#93c9ff;
 color:#fff;
 border-radius:2px;
 margin-right:5px;
 position:relative;
 bottom:1px;
}
	
	
/*ラジオボタンを縦並び指定*/
#contact_contents .contact_form_style .wpcf7-form-control{
 display:flex;
	justify-content: flex-start;
	align-items: center;
	flex-wrap: wrap;
}
	
/*ラジオボタンを縦並び指定*/
#contact_contents .contact_form_style .wpcf7-form-control.verticallist{
 display:flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-flow:column wrap;
}
#contact_contents .contact_form_style .wpcf7-form-control-wrap{
 display:inline-block;
}
	
	
/*送信ボタンのデザイン変更*/
#contact_contents .contact_form_style #formbtn{
 display: block;
 padding:1em 0;
	margin: 30px auto 0;
	max-width: 300px;
 width:100%;
 background:#c4143c;
 color:#fff;
 font-size:18px;
 font-weight:bold;	 
 border-radius:2px;
 border: none;
}
/*送信ボタンマウスホバー時*/
#contact_contents .contact_form_style #formbtn:hover{
 background:#fff;
 color:#c4143c;
}
#contact_contents .contact_form_style .flex_box{
		display: flex;
		justify-content: flex-start;
		align-items: flex-start;
	width: 90%;
	margin: 30px auto 0;
	}	
#contact_contents .contact_form_style .flex_box .wpcf7-form-control-wrap{
	width: auto !important;
	}

#contact_contents .contact_form_style .wpcf7 form .wpcf7-response-output {
	margin: 2em 0.5em 1em;
	padding: 20px 10px;
	border: 2px solid #00a0d2; /* Blue */
	text-align: center;
	font-size: 18px;
	font-weight: 700;
	color: #00a0d2;	
}

#contact_contents .contact_form_style .wpcf7 form.init .wpcf7-response-output {
	display: none;
}

#contact_contents .contact_form_style .wpcf7 form.sent .wpcf7-response-output {
	border-color: #46b450; /* Green */
	color: #46b450;		
}

#contact_contents .contact_form_style .wpcf7 form.failed .wpcf7-response-output,
#contact_contents .contact_form_style .wpcf7 form.aborted .wpcf7-response-output {
	border-color: #dc3232; /* Red */
	color: #dc3232;		
}

#contact_contents .contact_form_style .wpcf7 form.spam .wpcf7-response-output {
	border-color: #f56e28; /* Orange */
	color: #f56e28;		
}

#contact_contents .contact_form_style .wpcf7 form.invalid .wpcf7-response-output,
#contact_contents .contact_form_style .wpcf7 form.unaccepted .wpcf7-response-output {
	border-color: #ffb900; /* Yellow */
	color: #ffb900;		
}
.icc {
    display: flex; 
    flex-direction: column;
    text-align:center;
}    

}

	