/************************* スマートフォン用CSS *************************/
@media screen and (max-width:768px){ /* スマホ用 */
/********** 共通仕様 **********/
body{
	font-family:游ゴシック, メイリオ, "Meiryo UI", "ＭＳ ゴシック", Arial;
	font-size:16px;
	color:#333333;
	width:100%;
	margin:0px auto;
	padding:0px;
}

a { color:#0066FF; text-decoration:none; }
a:hover { color:#0066ff; text-decoration:underline; cursor:pointer; }

.clear-both { clear:both; }
.container { width:100%; margin:0px auto; padding:0px; }

.pagetop-wrap { display:none; }
.pagetop { display: none;}

.font-l-150 { font-size:150%; }

.wrap { width:100%; margin:0px auto; padding:0px; }
	

/********** ヘッダー用 **********/
.pc-header-container { display:none; }
.sp-header-container { width:100%; height:50px; margin:0px auto; padding:0px; clear:both; background:#fff; }

/********** フッター用 **********/
.footer-container { width:100%; margin:0px auto; padding:60px 0px; background:#303a79; color:#fff; }
.footer-wrap { width:100%; margin:0px auto; padding:0px; text-align:center; line-height:2.2em; font-size:85%; }
.footer-wrap a,.footer-wrap a:hover { color:#fff; }

.copyright { width:100%; margin:0px auto; padding:0px; line-height:2em; font-size:85%; text-align:center; }

/********** トップページ用 **********/
/***** スライドイメージ用 *****/
.tp-slide-wrap { margin-top:5px; }
.tp-slide-img-wrap { width:100%; margin:0px auto; padding:0px; }
.tp-slide-img-wrap img { width:100%; height:auto; }

/***** コンテンツ1 *****/
.tp-title1 { font-size:170%; text-align:center; line-height:1.9em; color:#666666; position:relative; margin-bottom:25px; }
.tp-title1:before { content:""; position:absolute; left:50%; bottom:0; width:0; border-bottom:2px #303a79 solid; transform:translateX(-50%); animation:border-ani-1 3s linear forwards; }
@keyframes border-ani-1{ 0% {width:0%;} 100%{ width:100%;}}
.tp-container1 { width:100%; }
.tp-wrap1 { width:100%; margin:0px auto; padding:0px; }
.tp-wrap1 table { width:100%; }
.tp-wrap1 table th { width:100%; display:block; }
.tp-wrap1 table th img { width:100%; height:auto; }
.tp-wrap1 table td { width:100%; display:block; line-height:2em; }

/***** コンテンツ2 *****/
.tp-container2 { width:100%; background:#f6f6f6; margin-top:10px; padding-bottom:20px; }
.tp-wrap2 { width:100%; margin:0px auto; padding:0px; }
.tp-wrap2 table { width:100%; }
.tp-wrap2 table th { width:100%; display:block; }
.tp-wrap2 table th img { width:100%; height:auto; }
.tp-wrap2 table td { width:100%; display:block; line-height:1.9em; text-align:center; }

/***** コンテンツ3 *****/
.tp-title3 { font-size:170%; text-align:center; line-height:1.9em; color:#666666; position:relative; margin-bottom:25px; }
.tp-title3:before { content:""; position:absolute; left:50%; bottom:0; width:0; border-bottom:2px #303a79 solid; transform:translateX(-50%); animation:border-ani-1 3s linear forwards; }
@keyframes border-ani-3{ 0% {width:0%;} 100%{ width:100%;}}
.tp-container3 { width:100%; margin-top:50px; padding-top:20px; border-top:1px #cccccc solid; }
.tp-wrap3 { width:100%; margin:0px auto; padding:0px; }
.tp-wrap3 table { width:100%; }
.tp-wrap3 table th { width:100%; display:block; }
.tp-wrap3 table th img { width:100%; height:auto; }
.tp-wrap3 table td { width:100%; display:block; line-height:2em; }


/********** ページタイトル **********/
/* 共通フォント */
.pg-title-font1 { padding-top:15px; font-size:180%; position:relative; line-height:1.9em; color:#303a79; font-weight:bold; }
.pg-title-font1:before { content:""; position:absolute; left:50%; bottom:0; width:0; border-bottom:1px #cccccc solid; transform:translateX(-50%); animation:pg-title-font 3s linear forwards; }
.pg-title-font2 { font-size:110%; text-shadow:1px #cccccc; line-height:1.9em; color:#303a79; }
@keyframes pg-title-font{ 0% {width:0%;} 100%{ width:100%;}}

/* 会社概要 */
.pg-title_ablut-container { width:100%; margin:0px auto; padding:0px; background-image:url('../imgs/page-title/timg_about_01.png'); background-repeat:no-repeat; background-size:cover; }
.pg-title_ablut-wrap { width:100%; margin:0px auto; padding:0px; }
/* 実績 */
.pg-title_work-container { width:100%; margin:0px auto; padding:0px; background-image:url('../imgs/page-title/timg_work_01.png'); background-repeat:no-repeat; background-size:cover; }
.pg-title_work-wrap { width:100%; margin:0px auto; padding:0px; }
/* 採用情報 */
.pg-title_recruit-container { width:100%; margin:0px auto; padding:0px; background-image:url('../imgs/page-title/timg_recruit_01.png'); background-repeat:no-repeat; background-size:cover; }
.pg-title_recruit-wrap { width:100%;margin:0px auto; padding:0px; }
/* お問合せ */
.pg-title_contact-container { width:100%; margin:0px auto; padding:0px; background-image:url('../imgs/page-title/timg_contact_01.png'); background-repeat:no-repeat; background-size:cover; }
.pg-title_contact-wrap { width:100%; margin:0px auto; padding:0px; }



/********** 会社概要 **********/
.pg-about-container { width:100%; margin:0px auto; padding:20px 0px 35px 0px; background:#ececec; }
.pg-about-wrap { width:100%; margin:0px auto; padding:0px; }
.pg-about-wrap table { width:95%; margin:0px auto; padding:0px; line-height:2em; }
.pg-about-wrap table tr { border-bottom:1px #cccccc solid; }
.pg-about-wrap table th { padding:20px 5px 0px 5px; display:block; }
.pg-about-wrap table td { padding:0px 5px 5px 18px; display:block;  }

/********** 施工実績 **********/
.pg-work-container { width:100%; margin:0px auto; padding:20px 0px; background:#f3f3f3; }
.pg-work-wrap { width:100%; max-width:960px; margin:0px auto; padding:0px; }
.pg-work-wrap table { width:100%; margin:0px auto; }
.pg-work-wrap table td { padding:10px; display:block; }
.pg-work-wrap table td img { width:100%; height:auto; border:7px #fff solid; box-shadow:5px 5px rgba(214,214,214,0.5); }

/********** 採用情報 **********/
.pg-recruit-container { width:100%; margin:0px auto; padding:80px 0px; background:#ececec; }
.pg-recruit-wrap { width:100%; max-width:720px; margin:0px auto; padding:0px; text-align:center; font-size:150%; }


/********** お問合せ **********/
.pg-contact-container { width:100%; max-width:960px; margin:0px auto; padding:25px 0px; }
.pg-contact-container table { width:100%; max-width:900px; margin:0px auto; padding:0px; }
.pg-contact-container table tr { border-bottom:1px #cccccc dashed; }
.pg-contact-container table th { font-weight:normal; padding:20px 5px 0px 5px; display:block; }
.pg-contact-container table td { font-weight:normal; padding:5px 15px 5px 15px; display:block;  }
.pg-contact-container input { width:100%; border:1px #cccccc solid; border-radius:5px; line-height:2.2em; }
.pg-contact-container textarea { width:100%; border:1px #cccccc solid; border-radius:5px; line-height:2.2em; }
.contact-btn-area { width:80%; margin:0px auto; padding:20px 0px; text-align:center; }
.contact-btn-area input { width:100%; margin:10px 0px; padding:5px; line-height:2.3em; }

}