@charset "utf-8";
/*====================================================
elements
====================================================*/
body {
    font-family: 'Noto Sans JP', sans-serif;
    -webkit-text-size-adjust: none;
    /* フォントサイズ自動調整 */
}
a {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    text-decoration: none;
}
a:hover {
    opacity: 0.8;
    transition: 0.5s;
}
img {
    vertical-align: bottom;
    width: 100%;
}
li {
    list-style: none;
}
/*====================================================
font color
====================================================*/
sup {
    font-size: 50%;
    vertical-align: super;
}
/*====================================================
table
====================================================*/
table {
    border-collapse: collapse;
    border-spacing: 0px;
}
/*====================================================
使用頻度の高いもの
====================================================*/
/* フレックス */
.flex {
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
}
/* ポジション */
.pos {
    position: relative;
}
.center {
    text-align: center;
}
/* パディングトップ */
.pt10 {
    padding-top: 10px;
}
.pt15 {
    padding-top: 15px;
}
.pt20 {
    padding-top: 20px;
}
.pt30 {
    padding-top: 30px;
}
.pt40 {
    padding-top: 40px;
}
.pt60 {
    padding-top: 60px;
}
.pt70 {
    padding-top: 70px;
}
.pt80 {
    padding-top: 80px;
}
.pt100 {
    padding-top: 100px;
}
/* パディングボトム */
.pb5 {
    padding-bottom: 5px;
}
.pb10 {
    padding-bottom: 10px;
}
.pb15 {
    padding-bottom: 15px;
}
.pb20 {
    padding-bottom: 20px;
}
.pb30 {
    padding-bottom: 30px;
}
.pb40 {
    padding-bottom: 40px;
}
.pb60 {
    padding-bottom: 60px;
}
.pb70 {
    padding-bottom: 70px;
}
.pb100 {
    padding-bottom: 100px;
}
/* パディング左右 */
.pr15 {
    padding-right: 15px;
}
.pr20 {
    padding-right: 20px;
}
.pl15 {
    padding-left: 15px;
}
.pl20 {
    padding-left: 20px;
}
/* マージントップ */
.mt10 {
    margin-top: 10px;
}
.mt20 {
    margin-top: 20px;
}
.mt30 {
    margin-top: 30px;
}
.mt40 {
    margin-top: 40px;
}
.mt60 {
    margin-top: 60px !important;
}
/* マージンボトム */
.mb40 {
    margin-bottom: 40px!important;
}
.mb60 {
    margin-bottom: 60px!important;
}
@media screen and (max-width: 600px) {
    .mt60 {
        margin-top: 30px!important;
    }
    .mb60 {
        margin-bottom: 30px!important;
    }
}