/* IMPORT CSS */
@import url("https://www.tsuzureori.com/css/grid.css");

img {
	max-width:100%;
	height: auto;/*高さ自動*/
}
a {
    display:block;
    color: #666;
    text-decoration-line: none;
}
a:hover { 
    color: #999;
}
a img:hover {
	opacity: 0.8;
}
.underline {
	border-bottom: 3px solid #000;
	padding-bottom: 0.5rem;
}
.center {
	text-align: center;
}

/*ヘッダー
-------------------------------------*/
.head {
	display: flex;
    flex-direction: row;
    padding: 1rem 0 0 0;
}

.head h1 { 
    padding: 1rem 0;
	font-weight: 700;
	letter-spacing: 3px;
}
.snsbox {
	margin-left: auto;
	font-size: 3.0rem;
	padding: 1rem 0 0 0;
}
nav ul {
	display: flex;
    flex-direction: row;
    justify-content: left;
    list-style: none;
	margin-bottom: 0;
}
nav li {
    display: flex;
    color: #e3461a;
}
nav li a {
    text-decoration: none;
    text-align: center;
    color: #e3461a;
}
nav a:hover {
    color: #333;
}
nav a {
    padding: 1rem;
}

@media screen and (min-width: 768px){
/* PC時はMENUボタンを非表示 */
#open,#close {
    display: none !important;
}

#navi {
    display: block !important;
}
}

@media screen and (max-width: 767px){
.head {
	flex-direction: column;
    text-align: left;
    margin-bottom: 20px;
}
.telbox {
	margin-left: 0;
	text-align: center;
}
.head #open,#close  {
    position: absolute;
    top: 28px;
    right: 12px;
    }
nav ul {
	flex-direction: column;
}
nav li {
	padding-top: 0;
	border-bottom: 1px solid #ccc;
	margin-bottom: 0;
}
/* スマホ時はMENUボタンを表示 */
#open,#close  {
    display: block;
    width: 50px;
    border: none;
    position: absolute;
    top: 20px;
    right: 12px;
}
/* スマホ時はメニューを非表示 */
#navi {
    display: none;
}
}

/*メイン画像
-------------------------------------*/
.mainimg img {
	width: 100vw;
}

/*メインコンテンツ
-------------------------------------*/
main {
    margin: 5rem 0 5rem 0;
}

/*キャッチタイトル
-------------------------------------*/
h2.catch {
	text-align: center;
	color: #666;
	font-size: 4.0rem;
	margin-bottom: 3rem;
}

   /*大仏*/
   .bg-img-daibutu {
   position: relative;
   background-image: url(https://www.tsuzureori.com/img/daibutu1.jpg);
   background-size: cover;
   }
/*製作工程*/
   .bg-img-hi {
   position: relative;
   background-image: url(https://www.tsuzureori.com/img/kiori-hi2.jpg);
   background-size: cover;
   }
/*帯*/
   .bg-img-obi1 {
   position: relative;
   background-image: url(https://www.tsuzureori.com/img/kiori-obi-01.jpg);
   background-size: cover;
   }
   /*帯*/
   .bg-img-obi2 {
   position: relative;
   background-image: url(https://www.tsuzureori.com/img/kiori-obi-02.jpg);
   background-size: cover;
   }
   /*帯*/
   .bg-img-obi3 {
   position: relative;
   background-image: url(https://www.tsuzureori.com/img/kiori-obi-03.jpg);
   background-size: cover;
   }

   /*パララックスコンテンツ背景透過*/
   .parallax-bg {
   position: relative;
   background-color: rgba(255, 255, 255, 0.8);
   background-size: cover;
   }
   /*パララックスコンテンツ背景白*/
   .parallax-bg-white {
   position: relative;
   background-color: rgba(255,  255,  255, 1);
   background-size: cover;
   }
   /*パララックスコンテンツ背景黒*/
   .parallax-bg-black {
   position: relative;
   background-color: rgba(0, 0, 0, 0.20);
   background-size: cover;
   }
   /*パララックス背景固定*/   
   body:before{
	   content:"";
	   position:fixed;
	   top:0;
	   left:0;
	   z-index:-1;
	   width:100%;
	   height:100vh;
	   background:url(https://www.tsuzureori.com/img/kiori-imai-hero.jpg) center no-repeat;
	   background-size:cover;
	   }
   
   /*パララックスファーストビュー*/
   .jumbotron-extend {
   position: relative;
   height: 100vh;
   min-height: 300px;
   background-color: transparent;
   background-size: cover;
   }
   /*パララックスファーストビュー文字位置*/
   .jumbotron-container {
   position: relative;
   top: 50%;
   transform: translateY(-50%);
   }
   /*パララックスコンテンツタイトル 白*/
   .title-text {
   text-shadow: 1px 2px 6px #000000; 
   font: bold; color: #fff; 
   text-align: center;
   }   
   /*パララックスコンテンツタイトル 黒*/
   .title-text-bk {
   text-shadow: 1px 2px 6px #eee; 
   font: bold; color: #3e3e3e; 
   text-align: center;
   }

   /*フッター
-------------------------------------*/
footer {
   background-image: url(https://www.tsuzureori.com/img/kiori-hi2.jpg);
   position: relative;
   background-color: rgba(0,  0,  0, 0.69);
   background-size: cover;   padding: 3rem 0;
}
footer h5 {
   border-bottom: 1px solid #ccc;
}
/*コピーライト
-------------------------------------*/
.copyright {
   text-align: center;
   padding: 1rem 0;
   background-color: transparent;
}
.copyright a {
   color: #000;
   text-decoration: none;
   display: inline-block;
}

/*ページトップへ戻るボタン
-------------------------------------*/
#pagetop {
    position: fixed;
    bottom: 15px;
    right: 15px;
}
#pagetop a {
    display: block;
    background-color: rgba(255, 255, 255, 0.5);
    color: #666;
    width: 50px;
    padding: 10px 5px;
    text-align: center;
}
#pagetop a:hover {
    background-color: rgba(255,  255,  255, 0.9);
}
/*パンくずリスト
-----------------------------------*/
.breadcrumb {
    margin: 0 0 1em 0;
    padding: 0;	
}
.breadcrumb li {
    list-style-type: none;
}
.breadcrumb li a {
    display: inline-block;
    color: #959fa5;
}
/*マージン
-----------------------------------*/
.mt-20 {
	margin-top: 20px;
}
.mb-20 {
	margin-bottom: 20px;
}