@charset "UTF-8";
/*
Theme Name:土居工務店様
Author:一日一分プラス　藤田（ofg）
*/

html	{height:100%; margin:0; padding:0;}
body	{
	width:100%;
	height:100vh;
	padding:0;
	margin:0;
	border:none;
	color:#000;
	font-size:100%;
	background:none;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;
	}
a img		{border:none;}
table		{border-collapse:collapse;}
.cl			{clear:both;}
.dsn		{display:none;}


/*フォントセット*/
.r	{color:#dc143c;}
.b	{color:#4682b4;}
.g	{color:#20b2aa;}
.t_r{text-align:right;}
.t_c{text-align:center;}
.t_l{text-align:left;}
.f50{font-size:65%;}
.f65{font-size:65%;}
.f85{font-size:85%;}
.f120{font-size:120%;}
.f130{font-size:130%;}
.f150{font-size:150%;}
.f180{font-size:180%;}
.f200{font-size:200%;}


/*下余白セット*/
.m0		{margin-bottom:0%;}
.m1		{margin-bottom:1%;}
.m2		{margin-bottom:2%;}
.m3		{margin-bottom:3%;}
.m5		{margin-bottom:5%;}
.m8		{margin-bottom:8%;}
.m10	{margin-bottom:10%;}
.m13	{margin-bottom:13%;}
.m18	{margin-bottom:18%;}


/*幅セット*/
.w60	{width:60%;}
.w80	{width:80%;}
.w88	{width:88%;}
.w100	{width:100%;}


/*ラップ*/
div.wrap		{margin:0; padding:0;}


/*画像*/
img.maru		{display:block; max-width:18%; border-radius:50%; margin:0 auto;}
img.img100		{width:100%;}


/*******************************************************/

/*ヘッダ、ロゴ、ナビ*/
header					{display:block; padding:0 0 1.5% 0; width:100%; height:auto; margin:0;}
header:after,
header:before {
    content: "";
    clear: both;
    display: block;
}

header div#logo			{display:block; float:left; width:28%; padding:1.2% 0 0 2%; background:url('img/logo.png') no-repeat left bottom 20%;}
header div#logo h1		{width:100%; text-align:left; font-size:180%; line-height:1.0; margin:0 0 0 8.8%; padding:0;}
header div#logo h1 a,
header div#logo h1 a:visited	{text-decoration:none; color:#009966;}
header div#logo h1 a:hover		{color:#228b22;}
header div#logo p				{font-size:88%; line-height:2; margin:0; padding:0 0 0 2.8%; text-align:left;}


header nav				{float:right; width:68%; margin:0; padding:0% 2% 0 0; text-align:right;}

header nav ul			{width:100%; display:block; margin:0; padding:3.3% 0 0 0;}
header nav ul li		{display:inline-block; font-size:120%; width:18%; list-style:none; padding:0; margin:0 auto; vertical-align:bottom; text-align:center; line-height:1.2; font-weight:bold;}
header nav ul li:nth-of-type(1)		{width:29%;}

header nav ul li a,
header nav ul li a:visited		{color:#000; font-style:normal; text-decoration:none;}
header nav ul li a:hover		{color:#009966; text-decoration:none;}

	/*スクロールするとナビを固定する*/
  .is-fixed {
    position:fixed;
    top:0;
    left:0;
    z-index:2;
    width:100%;
    background:#fff;
  }

/*******************************************************/

main							{width:100%; margin:0; padding:0 0 3% 0; background:#fff  url('img/mainbk.jpg') repeat-x bottom; background-size:28%;}
main article					{display:block; width:100%; padding:0; margin:0 0 8% 0;}
main article section			{width:88%; margin:0 auto; padding:0;}

main article h2				{display:block; height:38vh; font-size:7vmin; line-height:10vmin; margin:0 0 2% 0; padding:8% 6% 0 6%; width:88%; text-shadow:0 0 23px #000; color:#fff;}
main article h2.bg01		{background: url('img/bg01.jpg') no-repeat; background-size:100%;}



main article section h3				{font-size:5vmin; color:#000; text-align:center; width:100%; margin:0 0 0.5% 0;}

main article section h4				{font-size:3vmin; color:#000; text-align:left; width:100%; line-height:1.7; margin:0; padding:0;}

main article section p				{font-size:118%; line-height:1.5; padding:0; margin:0 0 1.6% 0;}


/*こだわり*/
main article section ul#kodawari		{width:77%; margin:0 auto; padding:0;}
main article section ul#kodawari li		{display:inline-block; list-style:none; margin:0; padding:0; width:33%; text-align:center;}
main article section ul#kodawari li img	{max-width:100%;}


/*会社概要*/
main article section table				{width:77%; margin:0 auto; padding:0; border-collapse:collapse;}
main article section table th,
main article section table td			{padding:1.6% 1%; border:1px solid #ccc; font-size:110%;}
main article section table td			{text-align:left;}


/*ページ内リンク*/
span#item03									{line-height:2; margin-bottom:5%; display:block;}
span#item04									{line-height:2.2; margin-bottom:5%; display:block;}


/*施工実績スライダー*/
	article#actualResults				{display:block; width:100%; padding:0; margin:0 0 8% 0;}
	article#actualResults section h3	{font-size:5vmin; color:#000; text-align:center; width:100%; margin:0;}
	
	/*○○様邸ラベル*/
	span.label {
	  position:absolute;
	  color:white;
	  font-size:3vmin;
	  text-shadow:0 0 23px #000;
	  font-weight:bold;
	}
	span.label-left-top{
	  left:15%;
	  top:10%;
	}

	article#actualResults ul{
	  display:block;
	  width:100%;
	  height:100vh;
	  padding:0;
	  margin:0;
	  box-sizing:border-box;
	  overflow:hidden;
	  position:relative;
	}
	
	article#actualResults ul li{
	 display:inline-block;
	 padding:0;
	 margin:0;
	 width:inherit;
	 height:inherit;
	 position:absolute;
	 opacity:0;
	 animation:slideAnime 28s ease infinite;
	}

	article#actualResults ul li img		{display:block; width:100%;}
	
	/*画像切り替えの速度（35s内で以下の割り当てで切り替える）*/
	article#actualResults ul li:nth-of-type(1) {animation-delay:0s;}
	article#actualResults ul li:nth-of-type(2) {animation-delay:4s;}
	article#actualResults ul li:nth-of-type(3) {animation-delay:8s;}
	article#actualResults ul li:nth-of-type(4) {animation-delay:12s;}
	article#actualResults ul li:nth-of-type(5) {animation-delay:16s;}
	article#actualResults ul li:nth-of-type(6) {animation-delay:20s;}
	article#actualResults ul li:nth-of-type(7) {animation-delay:24s;}	
	
	/*フェードインフェードアウトの速度*/
	@keyframes slideAnime{
		0%		{opacity:0;}
		1%		{opacity:1;}
		13%		{opacity:1;}
		18%		{opacity:0;}
		100%	{opacity:0;}
	}



/*お問合せ*/
main article section form					{margin-bottom:5%;}
main article section form table				{width:65%; margin:0 auto; padding:0; border-collapse:collapse;}
main article section form table th,
main article section form table td			{padding:1.6% 1%; border:none; font-size:110%;}
main article section form table th			{width:38%;}

main article section form table td input[name='name'],
main article section form table td input[name='address'],
main article section form table td input[name='tel']				{box-sizing: border-box; height:2em; width:80%; line-height:1.1;}
main article section form table td select[name='subject']			{box-sizing: border-box; height:2em; width:80%; line-height:1.1;}
main article section form table td textarea[name='message']			{box-sizing: border-box; height:10em; width:80%; line-height:1.1;}

main article section img.linePng					{width:5%; margin-top:0.8%;}

/*お問合せ　confirmation.php用*/
main article section h4#otoiawase	{text-align:center; margin-top:10%;}

/*ページトップ*/
main a#pageTop		{width:100%; text-align:center; display:block; padding-bottom:2%;}
main a#pageTop img	{max-width:100%;}

 
/*******************************************************/

footer			{width:100%; height:auto; background:#339933; font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro"; padding:2% 0; color:#fff;}
footer p			{font-size:130%; font-weight:bold; display:block; text-align:center; width:100%; margin:0 0 0.8% 0;}
footer p.copyright	{font-size:77%; font-weight:normal; display:block; margin:0; padding:0;}

footer ul			{width:58%; margin:0 auto 1% auto; padding:0;}
footer ul li		{font-size:100%; list-style:none; padding:0; margin:0;}
footer ul li strong	{font-size:120%;}
footer ul li:last-child		{margin-top:2%;}

footer ul li a,
footer ul li a:visited		{text-decoration:none; color:#fff;}
footer ul li a:hover		{text-decoration:none; font-weight:bold; color:#fff;}

footer ul li address		{padding:0; margin:0; text-align:left; font-style:normal;}





/**************************************************************/
/*タブレットレイアウト*/
@media screen and (max-width:910px) {
    body {
        box-sizing:border-box;
        width:100%;
        padding:0;
        margin:0;
    }
    
    /*ヘッダ*/
	header div#logo			{background-size:17%;}
	header div#logo h1		{margin-left:11%;}
	header div#logo p		{font-size:88%; line-height:1.3; margin-left:11%;}
	header nav ul li		{font-size:100%; vertical-align:middle;}
    
    /*メイン*/
	main					{background-size:38%;}
	main article section	{width:92%;}
	main article h2				{height:34vh; font-size:6vmin; line-height:7vmin;}

	/*こだわり*/
	main article section ul#kodawari			{width:100%;}
	main article section ul#kodawari li			{width:32%; padding:0; margin:0;}
	main article section ul#kodawari li img		{max-width:93%;}

	/*会社概要*/
	main article section table				{width:100%;}

	/*施工実績*/
	article#actualResults ul			{height:57vh;}

	/*お問合せ*/
	main article section form table			{width:100%;}
	main article section form table td		{padding:1% 0;}
	main article section form table th		{padding:1% 0; width:22%; font-size:88%;}

	/*LINEアイコン*/
	main article section img.linePng		{width:13%; margin-bottom:3%;}
	
	/*ページトップアイコン*/
	main a#pageTop img	{width:5%;}

	/*フッター*/
	footer ul			{width:68%; margin:0 auto 1% auto;}

}/**************************************************************/



/*スマホレイアウト*/
@media screen and (max-width:599px) {
    body {
        box-sizing:border-box;
        width:100%;
        padding:0;
        margin:0;
    }
    /*ヘッダ*/
	header					{padding-top:2%; background:url('img/logo.png') 33.8% bottom no-repeat; background-size:11%;}
	header div#logo			{background:none;}
	header div#logo h1		{font-size:120%; margin-top:5%; margin-left:0%;}
	header div#logo p		{font-size:55%; line-height:1.3;}

	header nav ul li					{font-size:68%; vertical-align:middle;}
	header nav ul li:nth-of-type(2),
	header nav ul li:nth-of-type(3),
	header nav ul li:nth-of-type(4)		{font-size:63%;}
	
	
	
    /*メイン*/
	main					{background-size:100%;}
	main article section	{width:92%;}
    
	main article h2				{height:22vh; font-size:5.5vmin; line-height:7vmin;}
	main article h2.bg01		{background: url('img/bg01.jpg') no-repeat; background-size:100%;}

	main article section p					{font-size:110%; line-height:1.5; margin-bottom:6%;}
	main article section h3,
	article#actualResults section h3		{font-size:130%;}
	main article section h4					{font-size:113%;line-height:1.5;}

	/*ページ内リンク*/
	span#item03,
	span#item04									{line-height:3.8; margin-bottom:5%; display:block;}
		
	/*こだわり*/
	main article section ul#kodawari			{width:100%;}
	main article section ul#kodawari li			{width:32%; padding:0; margin:0;}
	main article section ul#kodawari li img		{max-width:93%;}
	
	/*会社概要*/
	main article section table				{width:100%;}
	main article section table th,
	main article section table td			{font-size:88%;}
	
	/*施工実績*/
	span.label {font-size:4.3vmin; font-weight:bold;}
	span.label-left-top{left:8%; top:8%;}
	
	article#actualResults ul			{height:35vh;}
	article#actualResults ul li img		{width:100%;}

	main a#pageTop img	{max-width:58%;}
	
	/*お問合せ*/
	main article section form				{margin-bottom:13%;}
	main article section form table			{width:100%;}
	main article section form table td		{padding:1% 0;}
	main article section form table th		{padding:1% 0; width:22%; font-size:80%;}
	/*入力フォーム幅*/
	main article section form table td input[name='name'],
	main article section form table td input[name='address'],
	main article section form table td input[name='tel'],
	main article section form table td select[name='otoiawase'],
	main article section form table td textarea[name='message']			{width:100%;}
	
	/*LINEアイコン*/
	main article section img.linePng		{width:15%; margin-bottom:3%;}
	
	/*ページトップアイコン*/
	main a#pageTop img	{width:10%;}


	/*フッター*/
	footer p			{font-size:80%;}
	footer ul			{width:88%; margin:0 auto 1% auto;}
	footer ul li		{font-size:88%; line-height:1.3;}
	footer ul li strong	{font-size:110%;}

}/**************************************************************/