/*
Click nbfs://nbhost/SystemFileSystem/Templates/Licenses/license-default.txt to change this license
Click nbfs://nbhost/SystemFileSystem/Templates/ClientSide/css.css to edit this template
*/
/* 
    Created on : 2022/06/22, 21:52:46
    Author     : yuka
*/
/* Basic settings ------------------------------------------------------------*/
section {padding: 0.5em 1em 1em 1em;}
div {margin: 0.5em auto 1em auto;}
h1, h2, h3, h4 {margin: 0.5em;}
p {margin: 0.5em;}

.mobile {display: none;}
.tablet {display: block;}
.pc {display: block;}
.notmobile {display: none;}

#header_menu, #sub_menu {display: none;}
#mobile_menu, #sub_mobile_menu {
    display: block;
    width: 100%;
    height: 3em;
    font-size: 26px;
    letter-spacing: 0.1em;
    font-weight: 500;
    z-index: 10;
    padding: 0.6em 0 0 1.2em;
    position: relative;
    background-color: rgba(255, 255, 255, 0.8);
    background-image: url(./images/menuObj.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right;
}
#mobile_menu {margin: -3em 0 0 0;}
#mobile_menu ul, #sub_mobile_menu ul {
    display: none;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column wrap;
            flex-flow: column wrap;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    padding: 0;
    border-width: 0 1px 1px 1px;
    border-color: rgba(26, 26, 26, 0.8);
    background-color: #ffffff;
    position: absolute;
    left: 0;
    top: 3em;
    width: 100%;
    border-bottom: 2px solid rgba(26, 26, 26, 0.8);
    margin: 0 0 1em 0;
}
#mobile_menu ul li, #sub_mobile_menu ul li{
    width: 100%;
    line-height: 1.5em;
    text-align: center;
    display: block;
    position: relative;
    margin: 0.5em 0;
    padding: 0;
}
#mobile_menu ul li a, #sub_mobile_menu ul li a {
    height: auto;
    width: 100%;
    position: relative;
    margin: 0;
    padding: 0.5em 0;
}
#mobile_menu ul li a img, #mobile_menu img, #sub_mobile_menu img {
    height: 1.5em;
    width: auto;
    padding: 0;
}
#mobile_menu ul li a img, #sub_mobile_menu ul li a img {margin: 0 auto;}
.mobileMenu_active {background-image: url(./images/menu_exit.svg);}

#footermenu ul {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column wrap;
            flex-flow: column wrap;
    text-align: center;
    line-height: 2em;
}
#header_menu ul li a, #footermenu ul li a{padding: 0 20px;}

/* 2段組レイアウト */
a.twocolumns {padding: 0.5em;}

/* 2列の画像タイル */
.img2columntile img {margin: 0.5em 0.1em;}

/* 3列の画像タイル */
.img3columntile a, .img3columntile div {
    width: 48%;
    max-width: 720px;
    margin: 10px 1%;
}

/* PageTopBtn */
#to_top {right: 2em;}

/* print用は非表示 */
.print {display: none;}

/* About Settings ----------------------------------------------------------- */
#companyinfo .twocolumns {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column wrap;
    flex-flow: column wrap;
}
#companyinfo .twocolumns .textcolumn, #companyinfo .twocolumns .imgcolumn {
    width: 98%;
    margin: 1em auto;
}

/* Blog Detail Settings ----------------------------------------------------- */
#blogdetail .twocolumns {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}
#blogdetail .textcolumn {
    width: 100%;
    max-width: 900px;
}
#blogdetail .imgcolumn {
    width: 100%;
    max-width: 720px;
    margin: 0;
}
#blogtxt1{-webkit-box-ordinal-group: 2;-ms-flex-order: 1;order: 1;}
#blogimg1{-webkit-box-ordinal-group: 3;-ms-flex-order: 2;order: 2;}
#blogtxt2{-webkit-box-ordinal-group: 4;-ms-flex-order: 3;order: 3;}
#blogimg2{-webkit-box-ordinal-group: 5;-ms-flex-order: 4;order: 4;}