@charset "utf-8";

html{
	overflow-y: scroll;
	height:100%;
}

body {
    font-family: 'Garamond', 'Times New Roman', '游明朝', YuMincho, 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 'HG明朝E', 'ＭＳ Ｐ明朝', 'MS PMincho', 'メイリオ', Meiryo, serif;
    line-height: 1.7;
	height: 100%;
	width:100%;
	-webkit-text-size-adjust:100%;
    background:#FBFAF5;
}

#wrapper {
    /* 画像を常に天地左右の中央に配置 */
    background-position: center center;

    /* 画像をタイル状に繰り返し表示しない */
    background-repeat: no-repeat;

    /* コンテンツの高さが画像の高さより大きい時、動かないように固定 */
    background-attachment: fixed;

    /* 表示するコンテナの大きさに基づいて、背景画像を調整 */
    background-size: cover;
}

#history #wrapper {
    background-image: url(../images/bg_history.jpg);
}

#flow #wrapper {
    background-image: url(../images/bg_flow.jpg);
}

#plan #wrapper {
    background-image: url(../images/bg_plan.jpg);
}

/*--------------------------------------------------
	header
--------------------------------------------------*/
header {
    overflow: hidden;
    position: fixed;
    width: 100%;
    z-index: 100;
    background: url(../images/bg_header.png) repeat-x;
    height: 108px;
    line-height: 1;
}

#hcontents {
    width: 980px;
    margin: 10px auto;
}

#hcontents h1 {
    float: left;
    width: 162px;
    margin: -25px 0 0 18px;
}

#limit {
    text-align: center;
    letter-spacing: .25em;
    color: #cc6600;
    font-size: 120%;
    margin-top: 10px;
}

#limit-inner {
    width: 9em;
}

#limit-inner:before,
#limit-inner:after {
    content: "";
    border: 1px solid #cc6600;
    width: 10px;
    height: 10px;
    display: inline-block;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
}

#limit-inner:before {
    margin: 0 20px 0 0;
}

#limit-inner:after {
    margin: 0 0 0 20px;
}

#gnav {
    float: right;
    width: 740px;
    margin-right: 15px;
    display: table;
    margin-top: 5px;
}

#gnav li {
    list-style: none;
    text-align: center;
    display: table-cell;
    vertical-align: middle;
    font-size: 95%;
}

#gnav li#nav_contact {
    padding-left: 20px;
    width: 12em
}

#gnav li#nav_contact .btn-inner {
    display: block;
    padding: 15px 0 12px;
    background: rgba(162,146,48,1.0);
}

#gnav li a {
    text-decoration: none;
    color: #222;
    display: block;
}

#gnav li#nav_contact a {
    color: #fff;
}

#gnav li a:hover {
    opacity: 0.7;
}

#gnav li#nav_contact a:hover .btn-inner{
    background: rgba(162,146,48,0.7);
}

#history #nav_history a,
#plan #nav_plan a,
#flow #nav_flow a,
#gallery #nav_gallery a,
#access #nav_access a{
    color: brown;
}
/*--------------------------------------------------
	common layout
--------------------------------------------------*/
#box {
    position: relative;
    clear: both;
    overflow: hidden;
    width: 900px;
    margin: 0 auto 0;
    padding: 130px 40px 40px;
    background: url(../images/bg_box.png);
}

footer {
    overflow: hidden;
    position: relative;
    bottom: 0;
    /*background:rgba(34,38,82,0.96);*/
    background: #222659;
    width: 100%;
    text-align: center;
}

footer ul {
    /*text-align: left;
    display: inline-block;
    /display: inline;
    /zoom: 1;*/
    margin: 18px 0 10px;
    font-size: small;
}

footer li {
    /*margin: 0 15px 0 0;*/
    color: #fff;
/*    display: inline-block;
    vertical-align: middle;*/
    list-style: none;
}

/*footer li:last-child {
    margin: 0;
}
*/
footer p {
    clear: both;
    text-align: center;
    color: #fff;
    margin-bottom: 15px;
    font-size: small;
}

footer a {
    color: #fff;
}

/*--------------------------------------------------
	parts
--------------------------------------------------*/
#title {
    font-size: 180%;
/*    font-weight: normal;*/
    margin-bottom: 0.5em;
}

#box h2 {
    font-size: 140%;
    margin-bottom: 0.5em;
    line-height: 1.4;
}

table{
	border:1px solid #ccc;
	margin:0 0 15px;
	clear:both;
}

th{
	padding:5px 10px 3px;
	background:#EEEEDD;
	border-bottom:1px solid #ccc;
	text-align:left;
    font-weight: normal;
    font-size: small;
}


td{
	padding:5px 10px 3px;
	border-bottom:1px solid #ccc;
	background:#fff;
    font-size: small;
}

ol{
	counter-reset:li;
	list-style-type:none;
	*list-style-type: decimal; 
}

.list{
	margin:0 0 10px;
	float:left;
	overflow:hidden;
}

.list dt{
	margin-bottom:0.5em;
	font-weight:normal;
}

.list dt{
	background:url(../images/icon_list.gif) no-repeat left 0.6em;
	padding-left:14px;
	margin-bottom:0.15em;
	float:left;
	width:15em;
	clear:both;
}

.list dd{
	margin:0 0 0.2em 18em;
}

.list li{
	background:url(../images/icon_list.gif) no-repeat left 0.6em;
	padding-left:14px;
	margin-bottom:0.15em;
}

.br-sp {
    display: inline;
}

.small {
    font-size: 80%;
}

.x-small {
    font-size: 60%;
}

.italic {
    font-style: italic;
}

.clear {
    clear: both;
}

.clearfix {
    zoom: 1;
    /*for IE 5.5-7*/
}

.clearfix:after {
    /*for modern browser*/
    content: ".";
    display: block;
    height: 0px;
    clear: both;
    visibility: hidden;
}
/*--------------------------------------------------
	index
--------------------------------------------------*/
#top-wrapper {
    position: relative;
}

.img-wrapper {
    width: 100%;
    height: 100%;
    position: relative;
    padding: 66.66% 0 0;
}

.img-wrapper::before {
    content: '';
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    -webkit-transition: all .25s ease;
    -moz-transition: all .25s ease;
    -ms-transition: all .25s ease;
    -o-transition: all .25s ease;
    transition: all .25s ease;
}

.img-wrapper img {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

#top-wrapper p {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    z-index: 50;
    width: 400px;
    height: 180px;
}

.block {
    display: flex;
    justify-content: center;
    align-items: center;
    -js-display: flex;
    background: #222;
}

.block:nth-child(odd) {
    flex-direction: row-reverse;
}

.txt-area,
.photo-area {
    display: table-cell;
    width: 50%;
    vertical-align: middle;
    text-align: center;
    height: 100%;
}

.photo-area img {
    max-width: 100%;
    height: auto;
    line-height: 1;
    vertical-align: bottom;
}

.txt-area {
    color: #fff;
}

.txt-content {
    display: block;
}
.txt-area h2 {
    font-size: 180%;
    line-height: 1.4;
    letter-spacing: .1em;
    margin-bottom: 1em;
}

.btn {
    padding: 20px 0;
    width: 50%;
    border: 1px solid #fff;
    margin: 0 auto;
}

a.link_top{
    color: #fff;
    text-decoration: none;
    width: 100%;
    height: auto;
    text-align: center;
    display: block;
    margin: -15.5% 0;
    padding: 16% 0;
}

a.link_top:hover {
    opacity: 0.7;
}
/*--------------------------------------------------
	history
--------------------------------------------------*/
#history h2{
	margin-bottom:5px;
}

#leading_daitokuji{
	overflow:hidden;
}

#column_daitokuji{
	float:left;
	width:515px;
	margin:0 20px 0 0;
}

#map_daitokuji{
	width:365px;
	float:right;
}

.outline{
	margin-bottom:30px;
}

.outline p {
    margin-bottom:1em;
	text-indent:1em;
}

#detail_oubaiin{
	clear:both;
	overflow:hidden;
}

#map_oubaiin{
	position:relative;
}

#map_oubaiin div{
	position:absolute;
}

#map_oubaiin h3 {
    font-size: 90%;
}
#map_oubaiin p{
	font-size:70%;
    line-height: 1.6;
}

#area_kuri{
	width:270px;
	top:82px;
	left:605px;
}
#area_omotemon{
	width:190px;
	top:287px;
	left:689px;
}

#area_karamon{
	width:190px;
	top:455px;
	left:689px;
}

#area_kanzatei{
	width:140px;
	top:82px;
	left:370px;
}

#area_hondou{
	width:258px;
	top:618px;
	left:375px;
}

#area_hatoutei{
	width:210px;
	top:618px;
	left:32px;
}
#area_jikichutei{
	width:210px;
	top:420px;
	left:32px;
}

#area_jikyuken{
	width:210px;
	top:240px;
	left:32px;
}

#area_sabutsutei{
	width:258px;
	top:82px;
	left:32px;
}

/*--------------------------------------------------
	flow
--------------------------------------------------*/

section#leading {
    margin-bottom: 20px;
    overflow: hidden;
}

#message_priest {
    float: left;
    width: 64.44%;
}

#message_priest p {
    margin-bottom: 1em;
    text-indent: 1em;
}

#message_priest p:first-child {
    text-indent: 0;
}

#message_priest p:nth-last-child(2) {
    margin-bottom: 10em;
}

dl#flowContents,
div#planwrap {
    float: left;
    width: 66.66%;
}

dl#flowContents {
    counter-reset: number;
    /* 数字のカウントをリセットする */
    margin: 5px 0 5px 0;
    padding: 0 5% 0 0;
    width: 61.66%;
    /* paddingキャンセル */
    list-style: none;
    /* olがはき出す数字を消す */
}

#flowContents dt {
    padding: 0 0 0 0;
    /*    font-size: 140%;*/
    font-family: "ヒラギノ明朝 Pro W3", "Times New Roman", serif;
    color: #990000;
    font-weight: bold;
}

#flowContents dt {
    counter-increment: dtcount;
}

#flowContents dt:before {
    counter-increment: number;
    /* 任意の名前を付ける（もちろん英語で） */
    content: counter(number);
    /* 名前を付けたカウンターをcontentで発動！ */
    height: 30px;
    width: 28px;
    display: inline-block;
    line-height: 1.0;
    text-align: center;
    color: #fff;
    font-size: 1em;
    margin-right: 10px;
    padding: 10px 0 0;
    background: url(../images/step.png) no-repeat 0 3px;
    /* background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, #ffffff), color-stop(.25, transparent), to(transparent)),
	-webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, #ffffff), color-stop(.25, transparent), to(transparent)),
	-webkit-gradient(linear, 0 0, 100% 100%, color-stop(.75, transparent), color-stop(.75, #ffffff)),
	-webkit-gradient(linear, 0 100%, 100% 0, color-stop(.75, transparent), color-stop(.75, #ffffff));*/
}

#flowContents dd {
    margin: 0 0 20px 40px
}

.photo {
    float: left;
    width: 33.3%;
}

.photo img {
    margin-bottom: 25px;
    max-width: 100%;
}

.dis-sp {
    display: none;
}

/*--------------------------------------------------
	plan
--------------------------------------------------*/
.planlist{
	overflow:hidden;
	margin-bottom:30px;
}

#plan #box ul{
	clear:both;
}	

#plan h3{
	margin:0 0 5px;
	clear:both;
}

#plan h4{
	color:#3b4e27;
	margin:0 0 5px;
	float:left;
	width:10em;
	clear:both;
}

/*--------------------------------------------------
	gallery
--------------------------------------------------*/
#grid-wrapper {
    position:relative;
    max-width: 1200px;
    margin: 0 auto;
}
.grid {
    width: 100%;
    margin: 0 auto;
    line-height: 0;
    padding:108px 0 0;
/*
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    grid-template-rows: 320px 160px 160px auto;
*/
}

.grid-item {
    margin: 0 auto;
    width: 240px;
    height: 160px;
}

.grid-item--width2 { width:  480px; }
.grid-item--height2 { height: 320px; }
.grid-item--height2-2 { height: 320px; }

.grid-item a:hover {
    opacity: 0.7;
}

/*
.box-big1 {
    grid-column: 1 / 3;
    grid-row: 1 / 3;
}

.box-big2 {
    grid-column: 4 / 6;
    grid-row: 2 / 4;
}

.box-big3 {
    grid-column: 2 / 4;
    grid-row: 3 / 5;
}

.box-big4 {
    grid-column: 1 / 3;
    grid-row: 5 / 7;
}

.box-big5 {
    grid-column: 4 / 5;
    grid-row: 5 / 7;
}

.box-big6 {
    grid-column: 2 / 3;
    grid-row: 7 / 9;
}
.box-big7 {
    grid-column: 4 / 6;
    grid-row: 7 / 9;
}
*/
/*--------------------------------------------------
	access
--------------------------------------------------*/
section.access{
	clear:both;
	overflow:hidden;
}

section.access p{
	margin-bottom:10px;
}

.column{
	float:left;
	width:47%;
}

.map{
	margin-left:2%;
	float:right;
	width:50%;
}

#map_canvas1,
#map_canvas2{
	width:400px;
	height:300px;
	margin:0 0 30px 28px;
	border:1px solid #ccc;
	float:right;
}

.info{
	float:left;
	width:52%;
}

.info h2{
	margin-bottom:0;
}

.info h3{
	margin-bottom:5px;
}

/*--------------------------------------------------
	contact
--------------------------------------------------*/
#ban_tel {
    margin-bottom: 20px;
}
#message_contact {
    font-size: small;
    margin-bottom: 20px;
}
#formWrap {
	width:900px;
/*	margin:10px auto;*/
	line-height:120%;
	/*font-size:90%;*/
}

#appli-jinja #formWrap {
	width:800px;
}

#formWrap h2{
	margin:0 0 20px;
	text-align:center;
}
#formWrap h3{
	font-family:"Times New Roman","ヒラギノ明朝 ProN W3", "HiraMinProN", "HG明朝E", "メイリオ", Meiryo, serif;
	background:url(../images/icon_heading.png) no-repeat left top;
	line-height:1.2;
}

#formWrap table.formTable p {
	margin:0 0 5px;
	padding:0;
	font-size:13px;
}

table.formTable {
	margin:10px auto 20px;
	border-collapse:collapse;
	width:900px;
	table-layout: fixed;
}

table.formTable td, table.formTable th {
	border:1px solid #eee;
	padding:12px 12px 8px;
	font-size:100%;
}

table.formTable th {
	font-weight:normal;
	width: 28%;
	text-align:left;
	vertical-align:top;
}

.m-alert{
	padding: 0px 5px;
	float: right;
	background-color:#cd4860;
	color: #FFF;
	margin: 0px;
	font-weight: normal;
	font-size: 85%;
	border-radius: 3px;
}
input.checkbox, input.radio{
	top:-2px;
	margin-right:4px;
	position:relative;
	border:none;
}
input.bottom{
	margin-bottom:5px;
}
input.required,
select.required,
textarea.required{
	/*background:#ffdddd;*/
}

input:focus,
label:hover{
	background:#ffea98;
}

label:hover{
	border-radius:5px;
	cursor:pointer;
}

select{
	margin:-5px 4px 5px 0;
    font-size:16px;
}
table.formTable td ul li{
	margin-bottom:5px;
    list-style: none;
}
table.formTable td ul li:last-child{
	margin-bottom:0;
}

table.formTable td.error input , 
table.formTable td.error textarea , 
table.formTable td.error label {
    background:#FFCCCC;
}
* html table.formTable td.error label {
    background:none;
}
*+html table.formTable td.error label{
    background:none;
}
table.formTable td p.error{
    margin:0;
    color:red;
    font-weight:bold;
    margin-bottom:1em;
}
table.formTable td dl dt{
	float:left;
	width:6em;
	clear:both;
}

input[type="text"],
textarea{
	padding:2px 4px;
}
input[type="submit"],
input[type="reset"],
input[type="button"]{
	font-size: 100%;
    padding: 0.2em 0.4em;
    background: #eee;
    color: #333;
    border-radius: 4px;
    cursor: pointer;
    box-shadow: 0 0 1px rgba(0,0,0,.2);
    border: 1px solid #ccc;
    text-shadow: -1px 1px 0 rgba(255,255,255,1);
}
@media all and (max-width: 768px) {
    img {
        max-width: 100%;
        height: auto;
    }
    header {
        width: 100%;
        height: 108px;
        position: inherit;
    }
    #hcontents {
        width: 100%;
        margin: 0;
    }
    #hcontents h1 {
        width: 22%;
        margin: -2% 0 0 2%;
    }
    #limit {
        padding-top: 0.5%;
    }
    #gnav {
        float: right;
        width: 70%;
        /*background: none;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;*/
        margin: 1% 1% 0 0;
    }
    #gnav li {
        font-size: 90%;
        vertical-align: middle;
    }
    #gnav li a {
        display: block;
        font-weight: bold;
        padding: 100% 0;
    }
    #gnav li#nav_gallery,
    #gnav li#nav_contact {
        line-height: 1.3;
    }
    .br-sp {
        display: block;
    }
    #gnav li#nav_contact {
        color: #fff;
        padding-left: 0;
        width: auto;
    }

    #gnav li#nav_contact .btn-inner {
        padding: 10px 0 7px;
    }
}

@media all and (max-width: 640px) {
    body {
        /*    font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', 'Hiragino Kaku Gothic ProN', '游ゴシック  Medium', meiryo, sans-serif;
*/
    }
    /*--------------------------------------------------
        header
    --------------------------------------------------*/
    header {
        background-image: none;
        background-color: #fff;
        height: auto;
    }
    #limit {
        font-size: 80%;
        background-color: #cc6600;
        color: #fff;
        padding: 5px 0;
        margin: 0;
    }
    #limit-inner:before,
    #limit-inner:after {
        width: 8px;
        height: 8px;
        border-color: #fff;
    }
    #limit-inner:before {
        margin: 0 10px 0 0;
    }
    #limit-inner:after {
        margin: 0 0 0 10px;
    }
    #sp-hcontents {
        display: flex;
        justify-content: center;
        align-items: center;
        -js-display: flex;
    }
    #hcontents h1 {
        width: 40%;
        border: none;
        padding: 2% 0 1% 0;
        margin: 0 10% 0 5%;
        float: none;
    }
    #sp-nav {
        width: 43%;
        padding-right: 2%;
        display: flex;
        justify-content: space-around;
        align-items: center;
        -js-display: flex;
    }
    #sp-nav li {
        list-style: none;
        vertical-align: middle;
        text-align: right;
    }
    #sp-nav li#h_contact {
        color: #fff;
        background: #a29230;
        text-align: center;
        padding: 4% 5% 3%;
        font-size: 76%;
        margin: 0 0 0 1%;
        line-height: 1.3;
        width: 6em;
    }
    
    #sp-nav li#h_contact a {
        text-decoration: none;
        color: #fff;
    }
    #sp-nav li#h_tel {
/*        margin-right: 5%;*/
    }
    .fa-purple:before {
        color: #fff;
        background: #a29230;
        padding: 14% 20%;
    }
    #gnav {
        float: none;
        width: 100%;
        margin: 0;
        border-top: 1px solid #ccc;
        border-bottom: 1px solid #ccc;
    }
    #gnav li {
        width: 16.6%;
        font-size: 70%;
        text-align: center;
        border-right: 1px solid #ccc;
    }
    #gnav li#nav_gallery {
        line-height: 1.3;
        font-size: 70%;
    }
    #gnav li:nth-child(5) {
        border-right: none;
    }
    #gnav li#nav_contact {
        display: none;
    }
    #gnav li a {
        display: block;
        padding: 15% 0 10%;
        font-weight: bold;
    }
    #history #nav_history a,
    #plan #nav_plan a,
    #flow #nav_flow a,
    #gallery #nav_gallery a,
    #access #nav_access a{
        color: brown;
    }
    /*--------------------------------------------------
        common layout
    --------------------------------------------------*/
    #box {
        position: relative;
        clear: both;
        overflow: hidden;
        width: 90%;
        margin: 0 auto 0;
        padding: 5%;
        background: url(../images/bg_box.png);
    }

    footer ul {
        text-align: center;
        display: inherit;
        margin: 18px 5% 10px;
    }

    footer li {
        margin: 0 0 15px 0;
        color: #fff;
        display: inherit;
        vertical-align: middle;
    }

    footer li:last-child {
        margin-bottom: 1em;
    }

    footer p {
        clear: both;
        text-align: center;
        color: #fff;
        margin-bottom: 15px;
    }
    /*--------------------------------------------------
        index
    --------------------------------------------------*/
    #top-wrapper p {
        width: 200px;
        height: 90px;
    }
    #top_btn {
        width: 96%;
        margin: 0 2%;
        overflow: hidden;
    }
    #topBtn {
        margin-top: 2%;
    }
    .block {
        display: inherit;
        width: 47%;
        margin: 0 2% 2%;
        height: auto;
        position: relative;
        float: left;
        background: #000;
    }
    .block:nth-child(even) {
        margin-left: 0;
    }
    .txt-area,
    .photo-area {
        width: 100%;
    }
    .photo-area img {
        opacity: 0.7;
    }
    .block:nth-child(odd) {
        flex-direction: inherit;
    }
    .txt-area {
        padding: 0;
        position: absolute;
        top: 0;
        width: 100%;
    }
    .txt-content {
        position: absolute;
        top: 25%;
        text-align:center;
        width: 100%;
        height: auto;
    }
    a.link_top {
        margin: 0;
        padding: 33% 0;
    }
    .txt-area h2 {
        font-size: 100%;
        z-index: 100;
        margin-bottom: 0;
        text-shadow: 1px 1px 3px #000;
    }
    .txt-area .btn {
        display: none;
    }
    /*--------------------------------------------------
        history
    --------------------------------------------------*/
    #column_daitokuji{
        float:none;
        width:100%;
        margin:0 20px 0 0;
    }

    #map_daitokuji{
        width:100%;
        float:none;
    }

    #map_oubaiin h3 {
        font-size: 80%;
    }
    #map_oubaiin p{
        display: none;
    }

    #area_kuri{
        width:30%;
        top:13%;
        left:77%;
    }
    #area_omotemon{
        width:21%;
        top:42%;
        left:83%;
    }

    #area_karamon{
        width:21%;
        top:62%;
        left:83%;
    }

    #area_kanzatei{
        width:15.5%;
        top:13%;
        left:43%;
    }

    #area_hondou{
        width:28.7%;
        top:85.6%;
        left:51%;
    }

    #area_hatoutei{
        width:23.3%;
        top:85.6%;
        left:8.5%;
    }
    #area_jikichutei{
        width:23.3%;
        top:60%;
        left:8.5%;
    }

    #area_jikyuken{
        width:23.3%;
        top:34%;
        left:8.5%;
    }

    #area_sabutsutei{
        width:28.7%;
        top:13%;
        left:10.5%;
    }
    
    #message_priest {
        float: none;
        width: 100%;
    }

    dl#flowContents,
    div#planwrap {
        float: none;
        width: 100%;
    }
    
    .map{
        margin-left:0;
        float:none;
        width:100%;
    }
    
    .info{
        float:none;
        width:100%;
    }
    
    #map_daitokuji{
        display: none;
    }
    
    /*--------------------------------------------------
        parts
    --------------------------------------------------*/
    .photo {
        float: none;
        width: 100%;
        display: none;
    }

    .photo img {
        margin-bottom: 25px;
        max-width: 100%;
    }
    
    .dis-pc {
        display: none;
    }
    
    .dis-sp {
        display: block;
        margin: 0 0 1.5em 0;
    }
    
    .column{
        float:lnone;
        width:100%;
    }
    
    .list dt{
        width:12.5em;
    }

    .list dd{
        margin:0 0 0.2em 13.5em;
    }
    
    /*--------------------------------------------------
        gallery
    --------------------------------------------------*/
    .grid {
        padding-top: 10px;
    }
    .grid-item {
        padding-bottom: 10px;
    }
    .grid-item--width2 { width:  240px; }
    .grid-item--height2 { height: 160px; }
    .grid-item--height2-2 { height: 320px; }
    
    /*--------------------------------------------------
        contact
    --------------------------------------------------*/
    #formWrap,
    table.formTable{
        width: 100%;
    }
    table.formTable td, table.formTable th {
        display: block;
        width: 92%;
        border: none;
    }
    input[type="text"],
    textarea  {
        font-size: 16px;
        width:97%;
    }
    .half input[type="text"]{
        width:40%;
    }
    input[type="submit"],
    input[type="reset"],
    input[type="button"]{
        width: 40%;
        margin: 0;
        padding: 5px;
        font-size: 16px;
        /*background:#ce6b69;
        color: #FFF;
        -webkit-appearance: none;
        border-radius: 5px;
        border:none;*/
    }
}
@media screen and (min-width: 768px) and (max-width: 979px) {
    #box {
        position: relative;
        padding-top: 0;
        max-width: 92%;
    }
    .grid {
        padding-top: 0;
    }
}

@media all and (min-width: 639px) {
    #sp-nav {
        display: none;
    }
}

@media only screen
and (min-device-width:768px) 
and (max-device-width:1024px) 
and (orientation:portrait){
    a.link_top{
        margin: -8% 0;
        padding: 9% 0;
    }
}