@charset "utf-8";

#tright h3,
th {
    font-weight: 400
}

.twrapper,
header h1,
main {
    margin: 0 auto
}


.bpl {
    float: left
}

body {
    line-height: 1.6;
    font-size: 17px;
    font-family: Quicksand, 游ゴシック体, Yu Gothic, YuGothic, ヒラギノ角ゴシック Pro, Hiragino Kaku Gothic Pro, メイリオ, Meiryo, Osaka, ＭＳ\ Ｐゴシック, MS PGothic, sans-serif;
    color: #2e1c0e;
    font-feature-settings: "palt";
}

img {
    vertical-align: top;
    line-height: 0;
    max-width: 100%;
    height: auto;
    width: auto;
    margin: 0 auto;
}

th {
    text-align: left
}

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden
}

* html .clearfix {
    height: 1%
}

.clearfix {
    display: block
}

.sp {
    display: none !important
}

.red {
    color: #fa4664
}

.blue {
    color: #1e90ff
}

.bgy {
    background: #FFF9C4;
}

.bgbl {
    background: #1e90ff
}

.bggl {
    background: #5eac4c
}

.bgp {
    background: #e53996
}
.bgp02 {
    background: #ffc2fe;
}

.bgor {
    background: #e59e39
}

a {
    color: #6495ed
}

.tdu {
    text-decoration: underline
}

.tar {
    text-align: right;
    display: block
}

.tac {
    text-align: center;
}

header {
    width: 100%;
    border-top: #fa4664 5px solid;
    border-bottom: #ddd 1px solid;
    padding: 20px 0
}

header h1 {
    width: 166px
}

#title {
    width: 100%;
}

.twrapper {
    width: 750px
}

.twrapper figure {
    text-align: center;
}

#tright {
    padding: 30px 0;
    box-sizing: border-box;
    color: #fa4664
}

#tright h2 {
    font-size: 24px
}

#tright h3 {
    font-size: 16px
}

.bazztitle,
.box_title,
.title_pi {
    font-weight: 700
}

#tright p {
    font-size: 12px
}

#tright p i {
    line-height: 1em;
    font-size: 1.3em;
    vertical-align: middle;
}

main {
    width: 750px;
    padding: 50px 0
}

#kizi {
    margin: 0 0 50px
}

#other {
    border-top: #ccc 1px solid;
    padding: 30px 0 0
}

#other h3 {
    background: #eee;
    padding: 10px 0;
    line-height: 1;
    text-align: center;
    font-size: 30px;
    margin: 0 0 30px
}

.bpl,
.bpr {
    width: 400px;
    margin: 0 20px
}

.bpr {
    float: right
}

.bpl figure,
.bpr figure {
    margin: 0 0 10px
}

#kizi figure,
#kizi p {
    margin: 0 0 50px
}

.bpl h4,
.bpr h4 {
    font-size: 20px
}

.bpl h4 a,
.bpr h4 a {
    color: #2e1c0e;
    text-decoration: none
}

#kizi h3 {
    font-size: 20px;
    color: #fa4664;
    border-bottom: #fa4664 2px solid;
    margin: 0 0 30px;
    padding: 0 0 10px
}

.bluebox,
.box,
.voice {
    width: 100%;
    padding: 3%;
    box-sizing: border-box
}

#kizi figure {
    width: 100%;
    text-align: center
}

#kizi p.right {
    margin: 0 0 80px;
    text-align: right
}

.btn,
.cap_pi,
footer {
    text-align: center
}

.btn {
    width: 100%;
    margin: 0 0 50px
}

#kizi h4 {
    font-size: 25px;
    margin: 0 0 20px
}

.box,
.voice {
    background: #f8f8f8;
    border-radius: 5px;
    border: 3px solid #ccc;
    margin: 0 0 30px
}

.box_title {
    border-bottom: 2px solid #ccc;
    margin: 0 0 10px !important
}

.bluebox {
    border-radius: 5px;
    border: 3px solid #95CCFF;
    margin: 0 0 30px
}

#kizi .box p,
#kizi .voice p {
    margin: 0
}

.title_pi {
    background: #fa4664;
    padding: 5px 10px;
    border-radius: 10px 10px 0 0;
    color: #fff
}

.cap_pi {
    border: 1px solid #fa4664;
    border-radius: 0 0 10px 10px;
    padding: 20px;
    margin: 0 0 50px
}

.bazztitle {
    border-bottom: 1px solid #2e1c0e
}

#kizi li {
    margin: 0 0 50px;
    padding: 30px 0 0;
    border-top: 1px solid #ccc
}

#kizi li dd figure {
    margin: 0
}

#kizi li.users{
    padding: 30px;
    margin: 0 30px 50px;
}

#kizi .slick-dots li{
    border-top: none;
    margin-bottom: 20px;
}

li dd:nth-child(odd) {
    float: right;
    width: 30%
}

li dd:nth-child(even) {
    float: left;
    width: 68%
}

.voice th {
    width: 15%;
    vertical-align: middle;
    padding: 0 10px 0 0;
}

.voice td {
    vertical-align: middle;
}

footer {
    background: #f8f8f8;
    padding: 30px 0;
    border-top: #ddd 2px solid
}

footer h2 {
    width: 166px;
    margin: 0 auto 20px
}

footer p {
    font-size: 12px;
    margin: 0 0 10px
}

footer p a {
    color: #2e1c0e;
    text-decoration: none
}

.astitle h2 {
    color: #2e1c0e;
}

.astitle p {
    color: #2e1c0e;
}

#kizi .astitle2 {
    color: #2e1c0e;
    border-bottom: none;
    border-left: #fa4664 4px solid;
    padding: 0 0 0 10px;
}

.astitle2 span {
    display: inline;
    background: linear-gradient(transparent 70%, #ffc5c5 60%);
}

.cv_btn {
    animation: skew 2.3s linear infinite;
}


blockquote {
    position: relative;
    padding: 10px 15px 10px 60px;
    box-sizing: border-box;
    background: #f8f8f8;
    border-left: 4px solid #fa4664;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.14);
    margin: 0 0 50px;
}

blockquote:before {
    display: inline-block;
    position: absolute;
    top: 15px;
    left: 7px;
    vertical-align: middle;
    content: " “ ";
    font-family: serif;
    color: #fa4664;
    font-size: 100px;
    line-height: 1;
    font-weight: 900;
}

#kizi blockquote p {
    padding: 0;
    margin: 7px 0;
    line-height: 2;
    font-weight: 500;
}

blockquote cite {
    display: block;
    text-align: right;
    color: #888888;
    font-size: 0.9em;
}

.comment {
    background: #f8f8f8;
    padding: 5% 3%;
    margin: 0 0 3%;
}

#kizi .comment h4 {
    font-size: 20px;
    background: url(../shouga/images/comment.gif) no-repeat;
    background-size: 25px;
    background-position: left center;
    padding-left: 30px;
}

.comment_box {
    background: #fff;
    padding: 3%;
    margin: 0 0 3%;
}

.comment_box:last-child {
    margin: 0;
}

#kizi .comment_name {
    background: url(../shouga/images/noimage.jpg) no-repeat;
    background-size: 25px;
    background-position: left top;
    padding-left: 30px;
    margin: 0 0 3%;
}

#kizi .comment_text {
    margin: 0;
}

#kizi .fakeform p {
    margin: 0;
}

.fakeform h5 {
    margin-bottom: 3%
}

#kizi .fakeform input,
#kizi .fakeform textarea {
    width: 50%;
    padding: 5px;
    border-radius: 5px;
    border: 1px #ccc solid;
    display: block;
    margin-bottom: 3%;
}

.fakebtn {
    float: right;
    padding: 1% 5%;
    display: inline-block;
    background: #ccc;
    text-decoration: none;
    color: #fff;
}

.category {
    padding: 5px 10px;
    background: #6495ed;
    color: #fff;
    display: inline-block;
    border-radius: 5px;
    margin-bottom: 3%;
}

.category2 {
    padding: 5px 10px;
    color: #fff;
    display: inline-block;
    border-radius: 5px;
    font-size: 14px;
    margin: 0 5px 0 0;
}

.category3 {
    padding: 5px 10px 5px 25px;
    background-color: #fa4664;
    color: #fff;
    background-image: url(../caffetein/images/tag.gif);
    background-repeat: no-repeat;
    background-size: 15px;
    background-position: 5px center;
    display: inline-block;
    border-radius: 5px;
    margin-top: 2%;
    margin-right: 3px;
}

.big {
    font-size: 130%;
}

.big_l {
    font-size: 175%;
}
.big_ll {
    font-size: 200%;
}

.pink {
    color: hotpink;
}

.hogetitle {
    width: 750px;
    margin: 0 auto;
}

.hogetitle h1 {
    font-size: 20px;
    font-family: 'Roboto', sans-serif;
    line-height: 100%;
    margin-bottom: 3%;
}

.hogetitle h1 span {
    color: #00b800;
}

.hogetitle h2 {
    font-size: 22px;
    padding: 0 0 20px;
    margin: 0 0 20px;
    border-bottom: 1px solid #ccc;
}

.hogearea {
    font-size: 14px;
    margin: 0 0 10px;
}

.hogearea span {
    color: #555;
    margin: 0 10px;
}

.trytitle {
    color: #2e1c0e;
}

/*以下、①背景色など*/
.line-bc {
    padding: 20px 10px;
    max-width: 450px;
    margin: 0 auto;
    text-align: right;
    font-size: 14px;
    background: #7da4cd;

}

/*以下、②左側のコメント*/
.balloon6 {
    width: 100%;
    overflow: hidden;
}

.balloon6 .faceicon {
    float: left;
    margin-right: -50px;
    width: 40px;
}

.balloon6 .faceicon img {
    width: 100%;
    height: auto;
    border-radius: 50%;
}

.balloon6 .chatting {
    width: 100%;
    text-align: left;
}

.says {
    display: inline-block;
    position: relative;
    margin: 0 0 10px 10px;
    padding: 10px;
    max-width: 250px;
    border-radius: 12px;
    background: #edf1ee;
}

.says:after {
    content: "";
    display: inline-block;
    position: absolute;
    top: 3px;
    left: -19px;
    border: 8px solid transparent;
    border-right: 18px solid #edf1ee;
    -ms-transform: rotate(35deg);
    -webkit-transform: rotate(35deg);
    transform: rotate(35deg);
}

#kizi .says p {
    margin: 0;
    padding: 0;
}

/*以下、③右側の緑コメント*/

#kizi .mycomment p {
    display: inline-block;
    position: relative;
    margin: 0 10px 10px 0;
    padding: 8px;
    max-width: 250px;
    border-radius: 12px;
    background: #30e852;
    font-size: 15px;
    text-align: left;
}

.mycomment p:after {
    content: "";
    position: absolute;
    top: 3px;
    right: -19px;
    border: 8px solid transparent;
    border-left: 18px solid #30e852;
    -ms-transform: rotate(-35deg);
    -webkit-transform: rotate(-35deg);
    transform: rotate(-35deg);
}

.bold {
    font-weight: bold;
}

.tryq {
    font-size: 14px;
    display: inline-block;
    font-weight: 500;
}

.mb20 {
    margin-bottom: 20px !important;
}

.question_title {
    font-size: 18px;
    font-weight: bold;
}

.balloon1 {
    position: relative;
    display: inline-block;
    margin: 0 0 5%;
    padding: 5px 10px;
    min-width: 120px;
    max-width: 100%;
    color: #fff;
    font-weight: bold;
    text-align: center;
    font-size: 20px;
    background: #ff8e9d;
    border-radius: 5px;
}

.balloon1:before {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -15px;
    border: 15px solid transparent;
    border-top: 15px solid #ff8e9d;
}

.balloon1 p {
    margin: 0;
    padding: 0;
}

.q_title {
    font-size: 18px;
    font-weight: bold;
}

.q_kizi {
    width: 550px;
}

.arrow {
    padding: 0 15%;
    box-sizing: border-box;
}

input[type=radio] {
    display: none
}

label.radio {
    position: relative;
    display: inline-block;
    padding: 3px 3px 3px 20px;
    cursor: pointer
}

label.radio:after,
label.radio:before {
    position: absolute;
    content: '';
    top: 50%;
    border-radius: 100%;
    -webkit-transition: all .2s;
    transition: all .2s
}

label.radio:before {
    left: 0;
    width: 14px;
    height: 14px;
    margin-top: -8px;
    background: #f3f3f3;
    border: 1px solid #ccc
}

label.radio:hover:before {
    background: #fff
}

label.radio:after {
    opacity: 0;
    left: 4px;
    width: 8px;
    height: 8px;
    margin-top: -4px;
    background: #3498db;
    -webkit-transform: scale(2);
    transform: scale(2)
}

input[type="radio"]:checked+label.radio:before {
    background: #fff;
    border: 1px solid #3498db
}

input[type="radio"]:checked+label.radio:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

input[type=checkbox] {
    display: none
}

label.checkbox {
    position: relative;
    display: inline-block;
    padding: 3px 3px 3px 22px;
    cursor: pointer;
    -webkit-transition: all .2s;
    transition: all .2s
}

label.checkbox:after,
label.checkbox:before {
    position: absolute;
    content: '';
    -webkit-transition: all .2s;
    transition: all .2s
}

label.checkbox:before {
    top: 16px;
    left: 0;
    width: 14px;
    height: 14px;
    margin-top: -8px;
    background: #f4f4f4;
    border: 1px solid #ccc;
    border-radius: 3px
}

label.checkbox:after {
    opacity: 0;
    top: 16px;
    left: 3px;
    width: 8px;
    height: 4px;
    margin-top: -4px;
    border-left: 2px solid #3498db;
    border-bottom: 2px solid #3498db;
    -webkit-transform: rotate(-45deg) scale(.5);
    transform: rotate(-45deg) scale(.5)
}

label.checkbox:hover:before {
    background: #fff
}

input[type="checkbox"]:checked+label.checkbox:before {
    background: #fff;
    border: 1px solid #3498db
}

input[type="checkbox"]:checked+label.checkbox:after {
    opacity: 1;
    -webkit-transform: rotate(-45deg) scale(1);
    transform: rotate(-45deg) scale(1)
}

.answer {
    padding: 0 0 5%;
    font-size: 16px;
    border-bottom: 1px solid #ccc;
    margin: 0 0 5%;
}

.small {
    font-size: 80%;
}

.db {
    display: block;
}

.gray {
    color: #888;
}

.accbox {
    padding: 0;
    max-width: 100%;
    /*最大幅*/
    text-align: center;
}

/*ラベル*/
.accbox label {
    display: inline-block;
    color: #6495ed;
    font-weight: bold;
    cursor: pointer;
    transition: all 0.5s;
    border: 1px solid #6495ed;
    border-radius: 5px;
    padding: 2% 5%;
}

/*アイコンを表示*/
.accbox label:after {
    content: '▶';
    font-family: 'FontAwesome';
    padding-left: 8px;
}


/*チェックは隠す*/
.accbox input {
    display: none;
}

/*中身を非表示にしておく*/
.accbox .accshow {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.8s;
}

/*クリックで中身表示*/
.cssacc:checked+label+.accshow {
    height: auto;
    padding: 5px;
    opacity: 1;
}

.accbox .accshow p {
    margin: 15px 10px
}

/*アイコンを入れ替える*/
.cssacc:checked+label:after {
    content: '▼';
}

@keyframes skew {
    0% {
        transform: skew(0deg, 0deg);
    }

    5% {
        transform: skew(5deg, 4.2deg);
    }

    10% {
        transform: skew(-4deg, -3deg);
    }

    15% {
        transform: skew(3deg, 2.2deg);
    }

    20% {
        transform: skew(-2deg, -1.5deg);
    }

    25% {
        transform: skew(0.9deg, 0.9deg);
    }

    30% {
        transform: skew(-0.6deg, -0.6deg);
    }

    35% {
        transform: skew(0.3deg, 0.3deg);
    }

    40% {
        transform: skew(-0.2deg, -0.2deg);
    }

    45% {
        transform: skew(0.1deg, 0.1deg);
    }

    50% {
        transform: skew(0deg, 0deg);
    }
}

.flash {
    animation: Flash1 1s infinite;
}

@keyframes Flash1 {
    50% {
        opacity: 0;
    }
}

.sway {
    animation: yokoyure 3s ease .4s forwards infinite;
    transition: -webkit-transform .4s;
    transition: transform .4s
}

@keyframes yokoyure {

    100%,
    90% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    93% {
        -webkit-transform: translateX(-20px);
        transform: translateX(-20px)
    }

    96% {
        -webkit-transform: translateX(10px);
        transform: translateX(20px)
    }
}

.hys {
    width: 100%;
    font-size: 12px;
}

.hys_fs {
    font-size: 12px;
}

.hys th,
.hys td {
    border: 1px solid #ccc;
    padding: 10px;
    box-sizing: border-box;
}

.right_talk {
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-end;
    align-items: flex-start;
    margin-bottom: 40px;
}

#kizi .right_talk figure {
    margin: 0;
    width: 120px;
}

#kizi .right_talk figure img {
    border-radius: 5px;
    width: 120px;
}

#kizi .right_talk figcaption {
    font-size: 12px;
}

#kizi .right_talk p {
    position: relative;
    padding: 5px 10px;
    z-index: 2;
    background-color: #FFFFFF;
    border-style: solid;
    border-width: 1px;
    border-color: #CCCCCC;
    border-radius: 5px;
    margin-right: 20px;
    margin-bottom: 0;
}

#kizi .right_talk p::before {
    position: absolute;
    top: 9px;
    right: -6px;
    z-index: 1;
    height: 0;
    width: 0;
    border-style: solid none solid solid;
    border-width: 6px;
    border-color: transparent #CCCCCC;
    content: "";
}

#kizi .right_talk p::after {
    position: absolute;
    top: 9px;
    right: -5px;
    z-index: 3;
    width: 0;
    height: 0;
    border-style: solid none solid solid;
    border-width: 6px;
    border-color: transparent #FFFFFF;
    content: "";
}

.left_talk {
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-start;
    margin-bottom: 40px;
}

#kizi .left_talk figure {
    margin: 0;
    width: 120px;
}

#kizi .left_talk figure img {
    border-radius: 5px;
    width: 120px;
}

#kizi .left_talk figcaption {
    font-size: 12px;
}

#kizi .left_talk p {
    position: relative;
    padding: 5px 10px;
    z-index: 2;
    background-color: #FFFFFF;
    border-style: solid;
    border-width: 1px;
    border-color: #CCCCCC;
    border-radius: 5px;
    margin-left: 20px;
    margin-bottom: 0;
}

#kizi .left_talk p::before {
    position: absolute;
    top: 9px;
    left: -6px;
    z-index: 1;
    height: 0;
    width: 0;
    border-style: solid solid solid none;
    border-width: 6px;
    border-color: transparent #CCCCCC;
    content: "";
}

#kizi .left_talk p::after {
    position: absolute;
    top: 9px;
    left: -5px;
    z-index: 3;
    height: 0;
    width: 0;
    border-style: solid solid solid none;
    border-width: 6px;
    border-color: transparent #FFFFFF;
    content: "";
}

.balloon1-top {
    position: relative;
    display: block;
    margin: 2.5em auto;
    padding: 15px;
    min-width: 120px;
    max-width: 70%;
    color: #555;
    font-size: 16px;
    background: #ffd7cb;
    border-radius: 10px;
}

.balloon1-top:before {
    content: "";
    position: absolute;
    top: -30px;
    left: 50%;
    margin-left: -15px;
    border: 15px solid transparent;
    border-bottom: 15px solid #ffd7cb;
}

.balloon1-top p {
    margin: 0;
    padding: 0;
}

.ikki {
    font-size: 48px;
    border: 1px solid #ccc;
    padding: 3% 0;
    box-sizing: border-box;
    border-radius: 10px;
}

.kuchikomi {
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    padding :20px;
    margin-bottom: 40px;
}

.kuchikomi  table th {
    width:50px;
}

.kuchikomi  table td {
    vertical-align: bottom;
}

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

    #tright,
    .twrapper figure {
        width: 100%;
        float: none
    }

    .q_kizi {
        width: 94%;
    }

    .twrapper,
    header h1,
    main {
        margin: 0 auto
    }

    #other h3,
    body {
        line-height: 1.7
    }

    #kizi figure,
    #other h3,
    header {
        text-align: center
    }

    .box,
    .voice,
    footer {
        background: #f8f8f8
    }

    .pc {
        display: none !important
    }

    .sp {
        display: block !important
    }

    .tar {
        display: block;
    }

    body {
        font-size: 18px;
        color: #2e1c0e
    }

    header {
        width: 100%;
        border-top: #fa4664 3px solid;
        border-bottom: #ddd 1px solid;
        padding: 3% 0
    }

    header h1 {
        width: 60%
    }

    #title {
        width: 100%;
        background: #fff
    }

    .twrapper {
        width: 100%
    }

    #tright {
        padding: 3%;
        box-sizing: border-box;
        color: #fa4664
    }

    #tright h2 {
        font-size: 22px
    }

    #tright h3 {
        font-size: 18px;
        font-weight: 400
    }

    #tright p {
        font-size: 10px
    }

    main {
        width: 94%;
        padding: 5% 0
    }

    #kizi {
        margin: 0 0 5%
    }

    #other {
        border-top: #ccc 1px solid;
        padding: 3% 0 0
    }

    #other h3 {
        background: #eee;
        padding: 1% 0;
        font-size: 20px;
        margin: 0 0 3%
    }

    .bpl,
    .bpr {
        width: 49%;
        margin: 0
    }

    .bpl {
        float: left
    }

    .bpr {
        float: right
    }

    .bpl figure,
    .bpr figure {
        margin: 0 0 1%
    }

    .bpl h4,
    .bpr h4 {
        font-size: 18px
    }

    .bpl h4 a,
    .bpr h4 a {
        color: #2e1c0e;
        text-decoration: none
    }

    #kizi h3 {
        font-size: 18px;
        color: #fa4664;
        border-bottom: #fa4664 2px solid;
        margin: 0 0 3%;
        padding: 0 0 1%
    }

    #kizi figure {
        width: 100%;
        margin: 0 0 2%
    }

    #kizi p,
    #kizi p.right {
        margin: 0 0 8%
    }

    #kizi p.right {
        text-align: right
    }

    .btn,
    footer {
        text-align: center
    }

    .btn {
        width: 100%;
        margin: 0 0 5%
    }

    #kizi h4 {
        font-size: 20px;
        margin: 0 0 2%
    }

    li dd:nth-child(odd) {
        float: right;
        width: 100%
    }

    li dd:nth-child(even) {
        float: left;
        width: 100%
    }

    .bluebox,
    .box,
    .voice {
        width: 100%;
        padding: 3%;
        margin: 0 0 3%;
        box-sizing: border-box
    }

    .box,
    .voice {
        border-radius: 3px;
        border: 1px solid #ccc
    }

    .bluebox {
        border-radius: 3px;
        border: 1px solid #95CCFF
    }

    .title_pi {
        border-radius: 5px 5px 0 0
    }

    .cap_pi {
        padding: 10px;
        border-radius: 0 0 5px 5px;
        margin: 0 0 8%
    }

    .voice th {
        width: 25%;
        vertical-align: middle;
        padding: 0 5px 0 0;
    }

    .voice td {
        font-size: 14px;
    }

    footer {
        padding: 5% 3%;
        box-sizing: border-box;
        border-top: #ddd 2px solid
    }

    footer h2 {
        width: 60%;
        margin: 0 auto 2%
    }

    footer p {
        font-size: 8px;
        margin: 0 0 1%
    }

    .astitle h2 {
        color: #2e1c0e;
        display: inline;
        background: linear-gradient(transparent 70%, #ffc5c5 60%);
    }

    blockquote {
        position: relative;
        padding: 2% 3% 2% 13%;
        box-sizing: border-box;
        background: #f8f8f8;
        border-left: 4px solid #fa4664;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.14);
        margin: 0 0 5%;
    }

    blockquote:before {
        display: inline-block;
        position: absolute;
        top: 15px;
        left: 7px;
        vertical-align: middle;
        content: " “ ";
        font-family: serif;
        color: #fa4664;
        font-size: 70px;
        line-height: 1;
        font-weight: 900;
    }

    #kizi blockquote p {
        padding: 0;
        margin: 7px 0;
        line-height: 2;
        font-weight: 500;
        font-size: 15px;
    }

    #kizi blockquote p strong {
        font-size: 16px;
    }

    blockquote cite {
        display: block;
        text-align: right;
        color: #888888;
        font-size: 0.9em;
    }

    .hogetitle {
        width: 100%;
        box-sizing: border-box;
        padding: 0 3%;
        margin: 0 auto;
    }

    .hogetitle h2 {
        font-size: 18px;
        padding: 0 0 20px;
        margin: 0 0 20px;
        border-bottom: 1px solid #ccc;
    }

    .hogearea {
        font-size: 14px;
        margin: 0 0 10px;
    }

    .hogearea span {
        color: #555;
        margin: 0 10px;
    }

    .hys {
        font-size: 8px;
    }

    .hys_fs {
        font-size: 8px;
    }

    .balloon1-top {
        position: relative;
        display: block;
        margin: 2.5em auto;
        padding: 15px;
        min-width: 120px;
        max-width: 100%;
        color: #555;
        font-size: 16px;
        background: #ffd7cb;
        border-radius: 10px;
    }

    .ikki {
        font-size: 26px;
        border: 1px solid #ccc;
        padding: 3% 0;
        box-sizing: border-box;
        border-radius: 10px;
    }

    .kuchikomi {
        border-top: 1px solid #ccc;
        border-bottom: 1px solid #ccc;
        padding :3%;
        margin-bottom: 40px;
    }
    
}