/*
 *Theme Name: Metropolitan_clover
 */

 /*--------------------------------------------------------------
 >>> TABLE OF CONTENTS:
 ----------------------------------------------------------------
 1.0 Normalize
 2.0 Accessibility
 3.0 Alignments
 4.0 Clearings
 5.0 Typography
 6.0 Forms
 7.0 Formatting
 8.0 Lists
 9.0 Tables
 10.0 Links
 11.0 Featured Image Hover
 12.0 Navigation
 13.0 Layout
    13.1 Header
    13.2 Front Page
    13.3 Regular Content
    13.4 Posts
    13.5 Pages
    13.6 Footer
 14.0 Comments
 15.0 Widgets
 16.0 Media
    16.1 Galleries
 17.0 Customizer
 18.0 Media Queries(各々の場所に記述)
 --------------------------------------------------------------*/

/*フルサイズメニューからモバイルメニューへの切り替わり
  600px
  記述はPC表示をメインとし、@media screenを使ってスマホ表示を記述する。*/

 /*--------------------------------------------------------------
 1.0 Normalize
 Styles based on Normalize
 --------------------------------------------------------------*/
 
html{
    color: #404040;
}

body{
    top:0;
    margin:0;
    background-color: #fff;/*f0efed*/
}

main {
  clear:both;
  padding-top: 65px !important;
}

a.accent{
    background-image: url(images/triangle.png);
    background-repeat: no-repeat;
    background-size: contain;
    padding-left: 1.5em;
}

a{
    text-decoration: none;
    color: #208fff;
}

h1.post-title{
    font-size: 3.0em;
}

h2.post-crosshead{
    font-size: 1.5em;
}

/*--------------------------------------------------------------
 2.0 Accessibility
 --------------------------------------------------------------*/

 /*フォントの準備が完了するまで画面を表示させない*/
html {
    visibility: hidden;
}
html.wf-active {
    visibility: visible;
}

 /*--------------------------------------------------------------
 3.0 Alignments
 --------------------------------------------------------------*/

 /*--------------------------------------------------------------
 4.0 Clearings
 --------------------------------------------------------------*/

 /*--------------------------------------------------------------
 5.0 Typography
 --------------------------------------------------------------*/

 /* Typography for Japanese Font */

 html[lang="ja"] body,
 html[lang="ja"] button,
 html[lang="ja"] input,
 html[lang="ja"] select,
 html[lang="ja"] textarea {
 	font-family: "a-otf-ud-shin-maru-go-pr6n", sans-serif;
 }
 
 html[lang="ja"] h1,
 html[lang="ja"] h2,
 html[lang="ja"] h3,
 html[lang="ja"] h4,
 html[lang="ja"] h5,
 html[lang="ja"] h6 {
 	font-weight: 700;
 }


 /*--------------------------------------------------------------
 6.0 Forms
 --------------------------------------------------------------*/

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

    .g_top button{
        background-color: #8BC8E3;
    }

    .g_about button{
        background-color: #ad8cbf;
    }

    .g_amusement button{
        background-color: #e18ea5;
    }

    .g_map button{
        background-color: #93cc97;
    }

    .g_others button{
        background-color: #dfe48d;
    }

}

button{
    font-weight: bold;
    padding: 5px 15px;
    background-color: #404040;
    color: #ffffff;
    font-size: 0.8em;
    border-style: none;
}

.g_top button:hover{
    background-color: #8BC8E3;
}

.g_about button:hover{
    background-color: #ad8cbf;
}

.g_amusement button:hover{
    background-color: #e18ea5;
}

.g_map button:hover{
    background-color: #93cc97;
}

.g_others button:hover{
    background-color: #dfe48d;
}


@media screen and (max-width: 800px){
    
        .g_top .modal-footer button{
            background-color: #8BC8E3;
        }
    
        .g_about .modal-footer button{
            background-color: #ad8cbf;
        }
    
        .g_amusement .modal-footer button{
            background-color: #e18ea5;
        }
    
        .g_map .modal-footer button{
            background-color: #93cc97;
        }
    
        .g_others .modal-footer button{
            background-color: #dfe48d;
        }

        .g_top .modal button.close{
            text-align: right;
            color: #8BC8E3;
        }
        
        .g_about .modal button.close{
            text-align: right;
            color: #ad8cbf;
        }
        
        .g_amusement .modal button.close{
            text-align: right;
            color: #e18ea5;
        }

        .g_map .modal button.close{
            text-align: right;
            color: #93cc97;
        }

        .g_others .modal button.close{
            text-align: right;
            color: #dfe48d;
        }
    
}
    
    .modal-footer button{
        font-weight: bold;
        padding: 5px 15px;
        background-color: #404040;
        color: #ffffff;
        font-size: 0.8em;
        border-style: none;
    }
     
    .g_top .modal-footer button:hover{
        background-color: #8BC8E3;
    }
    
    .g_about .modal-footer button:hover{
        background-color: #ad8cbf;
    }
    
    .g_amusement .modal-footer button:hover{
        background-color: #e18ea5;
    }
    
    .g_map .modal-footer button:hover{
        background-color: #93cc97;
    }
    
    .g_others .modal-footer button:hover{
        background-color: #dfe48d;
    }

.modal-position{
    top: 25%;
}

.modal-title{
    text-align: left;
}

/*--------------------------------------------------------------
 8.0 Lists
 --------------------------------------------------------------*/

 /*--------------------------------------------------------------
 9.0 Tables
 --------------------------------------------------------------*/

table th{
    text-align: left;
    color: #ffffff;
}

.g_top table th{
    background-color: #8BC8E3;
}

.g_about table th{
    background-color: #ad8cbf;
}

.g_amusement table th{
    background-color: #e18ea5;
}

.g_map table th{
    background-color: #93cc97;
}

.g_others table th{
    background-color: #dfe48d;
}


@media screen and (max-width: 800px){
    .g_top table th{
        background-color: #404040;
    }
    .g_about table th{
        background-color: #404040;
    }
    .g_amusement table th{
        background-color: #404040;
    }
    .g_map table th{
        background-color: #404040;
    }
    .g_others table th{
        background-color: #404040;
    }
}

table tr:nth-child(even) {
    background: #f0efed;
}

table tr:nth-child(odd) {
    background: #ffffff;
}

th td{
    padding: 8px;
}

 /*--------------------------------------------------------------
 10.0 Links
 --------------------------------------------------------------*/

 /*--------------------------------------------------------------
 11.0 Featured Image Hover
 --------------------------------------------------------------*/

 /*--------------------------------------------------------------
 12.0 Navigation
 --------------------------------------------------------------*/

 /*--------------------------------------------------------------
 13.0 Layout
 --------------------------------------------------------------*/

  /*--------------------------------------------------------------
 13.0 Layout
 --------------------------------------------------------------*/
/* #main{
    margin-top:50px;
}*/

/*--------------------------------------------------------------
13.1 Header
--------------------------------------------------------------*/

/*--------------------------------------------------------------
13.2 Front Page
--------------------------------------------------------------*/

.a-link .pc{ display: block !important; }
.a-link .mobile { display: none !important; }

@media only screen and (max-width: 800px) {
    .a-link .pc { display: none !important; }
    .a-link .mobile { display: block !important; }
}

/*--------------------------------------------------------------
13.3 Regular Content
--------------------------------------------------------------*/

/*--------------------------------------------------------------
13.4 Posts
--------------------------------------------------------------*/


/*--------------------------------------------------------------
13.5 Pages
--------------------------------------------------------------*/

/*工事中ページ専用*/
.uc{
    margin: 0 auto;  
    text-align: center;
}
.uc .logo{
    width:280px;
    height:60px; 
    background-image:url("./images/header/site-logo(1400_300).svg");
    background-size:cover;
    background-position: center;
    margin: 0 auto;
    margin-bottom: 15px;
}

/*g_topページ以外の幅調整*/
.post-type-page,
footer{
   margin-right: auto;
   margin-left: auto;
   padding-top:10px;
   /*background-color: rgba(255,255,255,0.5);*/
   padding-bottom: 10px;
}

@media screen and (max-width: 783px){
    .post-type-page,
    footer{
        margin-left: 10px;
        margin-right: 10px;
    }
}
@media (min-width: 768px){
    .post-type-page,
    footer{
        width: 730px;
    }
}
@media (min-width: 992px){
    .post-type-page,
    footer{
        width: 950px;
    }
}
@media (min-width: 1200px){
    .post-type-page,
    footer{
        width: 1000px;
    }
}

.post-type-page h2{
    padding: 0px 0px 0px 5px; /* 余白の幅 */
    border-style: solid; /* 枠の種類 */
    border-width: 0px 0px 0px 7px; /* 枠の幅 */
}

.g_top .post-type-page h2{
    border-left-color: #8BC8E3;
}

.g_about .post-type-page h2{
    border-left-color: #ad8cbf;
}

.g_amusement .post-type-page h2{
    border-left-color: #e18ea5;
}

.g_map .post-type-page h2{
    border-left-color: #93cc97;
}

.g_others .post-type-page h2{
    border-left-color: #dfe48d;
}

/*--------------------------------------------------------------
13.6 Footer
--------------------------------------------------------------*/
.gf-footer-link{
    padding: 15px 0;
}
.gf-footer-link .social-icon{
    margin: 0 5px;
    width: 60px;
    height: 60px;
}

/*--------------------------------------------------------------
14.0 Comments
--------------------------------------------------------------*/

/*--------------------------------------------------------------
15.0 Widgets
--------------------------------------------------------------*/
.gf-footer-ad {
    background-color: #fff;
    position: relative;
    overflow:hidden;
    
}

.gf-footer-ad .widget{
    width: 234px;
    float: left;
    margin-bottom: 0;
    margin: 10px 0 10px 30px;
}

.gf-footer-ad .widget-title{
    display: none;
}


/*--------------------------------------------------------------
16.0 Media
--------------------------------------------------------------*/

/*--------------------------------------------------------------
16.1 Galleries
--------------------------------------------------------------*/

/*--------------------------------------------------------------
17.0 Customizer
--------------------------------------------------------------*/

/*--------------------------------------------------------------
18.0 Media Queries
--------------------------------------------------------------*/