body {
    background: fixed;
    margin: 0;
    background-image: url(//mindful-lifecareer.com/wp-content/themes/twentytwentythree-child/lp-img/mail/background.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}

.contents-wrapper {
    background: #fff;
    width: 1000px;
    margin: 0 auto;
}

p, li, span {
    margin: 0;
    letter-spacing: .14em;
    line-height: 1.8;
    font-family: YuGothic, 'Yu Gothic', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', sans-serif;
}

h1, h2, h3 {
    margin: 0;
    letter-spacing: .14em;
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;
    font-weight: normal;
}

.normal-text {
    text-align: left;
}

.normal-text p {
    letter-spacing: .14em;
    line-height: 1.8;
    font-size: 16px;
    color: #333;
}

a {
    text-decoration: none;
}

p {
    color: #333;
}

img {
    width: 100%;
    vertical-align: top;
}

ul {
    margin: 0;
    padding: 0;
}

.b-under {
    color: #5e718b;
    background: linear-gradient(to bottom, transparent 60%, rgb(94, 114, 139, .1) 60%);
    font-weight: 600;
    letter-spacing: .1em;
}

.p-under {
    background: linear-gradient(to bottom, transparent 60%, rgba(232, 223, 213, 0.8) 60%);
    font-weight: 600;
    letter-spacing: .1em;
}

.o-under {
    color: #af9476;
    background: linear-gradient(to bottom, transparent 60%, rgba(188, 94, 69, 0.1) 60%);
    font-weight: 600;
    letter-spacing: .1em;
}


/*js-animation*/

.js-animation {
    opacity: 0;
    visibility: hidden;
    transform: translateY(40px);
    transition: all 1s;
}

.js-animation.is-show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0px);
}


/* kv */

.sp-kv {
    display: none;
}

/* mail */
.mail-form {
    width: 80%;
    margin: 0 auto;
}


.input.text.input_unit.required {
    width: 500px;
    height: 70px;
    margin: 0 auto;
    margin-top: 20px;
}

form.myForm input[type="text"], form.myForm input[type="password"] {
    text-align: center;
    padding: 15px 5px !important;
    border-radius: 0 !important;
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;
    font-size: 16px;
    color: #5e718b !important;
}

input[type="submit"] {
    width: 500px;
    height: 60px;
    border-radius: 100px;
    border: none;
    color: #fff;
    font-size: 20px;
    letter-spacing: .2em;
    background-color: #c3ad94;
    cursor: pointer !important;
    transition: all 1s !important;
    box-shadow: 0px 4px 0px 1px #f0e1cf;
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;
    background-image: url(//mindful-lifecareer.com/wp-content/themes/twentytwentythree-child/lp-img/mail/submit-arrow.png);
    background-size: 30px;
    background-position: right 10% top 50%;
    background-repeat: no-repeat;
}

form.myForm div.submit {
    margin-top: 5px !important;
}

.content_title .input_unit, .content_box .input_unit .my_right.my_column, .content_form .input_unit .my_right.my_column, .content_confirm .input_unit .my_right.my_column {
    width: 100% !important;
}


/*js-animation*/

.js-animation {
    opacity: 0;
    visibility: hidden;
    transform: translateY(40px);
    transition: all 1s;
}

.js-animation.is-show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0px);
}

/* mail-wrapper1 */

.mail-wrapper {
    width: 70%;
    margin: 0 auto;
    background-color: #5e728b;
    padding: 30px 0px;
    box-shadow: 6px 6px 0px #a8b5c5;
    background-image: url(//mindful-lifecareer.com/wp-content/themes/twentytwentythree-child/lp-img/mail/mail-wrapper-bg.png);
    background-repeat: no-repeat;
    background-size: 500px;
    background-position: left -200px top -200px;
}

.mail-wrapper1 {
    margin-top: 30px;
}

.mail-wrapper2 {
    margin-top: 60px;
}

.mail-form-title {
    text-align: center;
}

.mail-form-title span {
    color: #fff;
    font-size: 40px;
    font-family: "cormorant-garamond", serif;
    font-style: italic;
    letter-spacing: .02em;
}


.mail-form-text1 p span:first-of-type {
    color: #fff;
    font-size: 60px;
    font-family: "linotype-didot", serif;
    font-style: italic;
    line-height: 1em;
    letter-spacing: .02em;
}

.mail-form-text1 p span:nth-of-type(2) {
    font-size: 55px;
    font-family: "cormorant-garamond", serif;
    font-style: italic;
    letter-spacing: .02em;
    color: #fff;
    line-height: 1em;
    padding-right: 5px;
}

.mail-form-text1 {
    text-align: center;
    margin-top: 0px;
}

.mail-wrapper1 .mail-form-text1{
    margin-top: 20px;
}

.mail-form-text1 p {
    color: #fff;
    font-size: 30px;
    letter-spacing: .1em;
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;
}

.mail-form-text1 .font-small {
    font-size: 24px;
}

.mail-form-text1 span {
    font-size: 36px;
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;
}

.mail-form-photo1 {
    margin-top: 20px;
}

.mail-wrapper1 .mail-form-photo1 {
    margin-top: 40px;
}

.mail-form-text2 {
    text-align: center;
    background: #fff;
    width: 90%;
    margin: 0 auto;
    padding: 30px 0px 20px;
    margin-top: 20px;
    position: relative;
}

.mail-form-text-bg1 {
    position: absolute;
    top: -20px;
    left: -20px;
    width: 60px;
}

.mail-form-text-bg2 {
    position: absolute;
    bottom: -20px;
    right: -20px;
    width: 60px;
}

.mail-form-text2 p {
    font-size: 14px;
    color: #5e728b;
    margin-bottom: 15px;
}

.mail-form-text2 p span {
    font-size: 14px;
    color: #AF9476;
}

.mail-form-text3 {
    text-align: center;
    margin-top: 10px;
}

.mail-form-text3 p {
    font-size: 24px;
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;
    color: #fff;
    letter-spacing: .1em;
    line-height: 1.7;
}

.mail-form-text4 {
    margin-top: 20px;
    text-align: center;
}

.mail-form-text4 p {
    font-size: 18px;
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;
    color: #fff;
    letter-spacing: .1em;
}

.mail-form-text4 p span {
    font-size: 18px;
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;
    color: #f0e1cf;
}


.mail-form-text5 {
    width: 80%;
    margin: 0 auto;
    margin-top: 20px;
}

.mail-form-text5 p {
    font-size: 10px;
    color: #fff;
}


/* foryou */

#foryou {
    width: 65%;
    margin: 0 auto;
    background: #fffdfb;
    border: solid 1px #af9476;
    padding: 50px 0px;
    margin-top: 50px;
    padding-top: 50px;
    background-image: url(//mindful-lifecareer.com/wp-content/themes/twentytwentythree-child/lp-img/online-mtg/recommend-bg.png);
    background-repeat: no-repeat;
    background-position: top 20px center;
    background-size: 120px;
}

#foryou .title {
    text-align: center;
}

#foryou .title h2 {
    font-size: 30px;
    color: #af9476;
}

.foryou-list ul {
    width: 85%;
    margin: 0 auto;
    margin-top: 30px;
}

.foryou-list ul li {
    font-size: 14px;
    list-style: none;
    margin-bottom: 15px;
    color: #39495e;
    padding-left: 30px;
    background-image: url(//mindful-lifecareer.com/wp-content/themes/twentytwentythree-child/lp-img/online-mtg/foryou-check.png);
    background-repeat: no-repeat;
    background-size: 15px;
    background-position: left 0px top 5px;
}

.foryou-list ul li:last-child {
    margin-bottom: 0;
}

.foryou-list ul li span {
    background: linear-gradient(to bottom, transparent 60%, rgb(157, 200, 221, .3) 60%);
    font-weight: 600;
    letter-spacing: .1em;
}

/* voice */

#voices {
    width: 700px;
    margin: 0 auto;
    max-width: 90%;
    padding: 50px 0 0;
    margin-top: 50px;
    background-image: url(//mindful-lifecareer.com/wp-content/themes/twentytwentythree-child/lp-img/mail/voice-title.png);
    background-repeat: no-repeat;
    background-position: top 20px center;
    background-size: 120px;
}

#voices .title {
    text-align: center;
}

#voices .title h2 {
    font-size: 28px;
    color: #5e718b;
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;
}

.voice-wrapper {
    display: flex;
    justify-content: space-around;
    margin-top: 30px;
}

.voice {
    width: 45%;
}

.voice-name {
    background-color: #5e728b;
    text-align: center;
    padding: 10px 0px;
    position: relative;
}

.voice-title-treat {
    position: absolute;
    left: 10px;
    top: -30px;
    width: 100px;
}

.job {
    display: block;
    color: #fff;
    font-size: 12px;
}

.name {
    color: #fff;
    font-size: 18px;
}

#voices .font-small {
    display: inline-block;
    padding-left: 5px;
    font-size: 14px;
    color: #fff;
}

.voice-content {
    background: #fcf9f5;
    padding: 30px 0px;
}

.voice-content p {
    width: 85%;
    margin: 0 auto;
    font-size: 15px;
}

/* greeting */

#greeting {
    margin-top: 70px;
}

.greeting-wrapper {
    position: relative;
    padding-bottom: 200px;
    background-image: url(//mindful-lifecareer.com/wp-content/themes/twentytwentythree-child/lp-img/online-mtg/greeting-bg1.png), url(//mindful-lifecareer.com/wp-content/themes/twentytwentythree-child/lp-img/online-mtg/greeting-bg2.png);
    background-position: left 0px bottom 0px, right 0px top 0px;
    background-size: 50%;
    background-repeat: no-repeat;
}

.greeting-photo1 {
    width: 70%;
}

#greeting .title {
    width: 65%;
    padding: 70px 0px 40px;
    background-color: #8c9cae;
    position: absolute;
    bottom: 20px;
    right: 0;
    background-image: url(//mindful-lifecareer.com/wp-content/themes/twentytwentythree-child/lp-img/online-mtg/greeting-bg3.png);
    background-size: 150px;
    background-repeat: no-repeat;
    background-position: top 20px left 50px;
}

#greeting .title h2 {
    width: max-content;
    max-width: 100%;
    margin: 0 auto;
    font-size: 28px;
    color: #fff;
    line-height: 1.6em;
}

.greeting-text {
    width: 80%;
    margin: 0 auto;
}

.greeting-text1 {
    margin-top: 20px;
}

.greeting-text p {
    margin-bottom: 20px;
}

.greeting-text p:last-child {
    margin-bottom: 0;
}

.greeting-text2 {
    text-align: center;
    margin-top: 50px;
}

.greeting-text2 p {
    color: #5e718b;
    font-size: 22px;
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;
}

.greeting-text2 span {
    color: #af9476;
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;
}

.greeting-photo2 {
    margin-top: 50px;
}

.greeting-text3 {
    margin-top: 50px;
}

.greeting-text4 {
    margin-top: 30px;
    text-align: center;
    background: rgb(212, 228, 245, .4);
    padding: 5px 0px;
}

.greeting-text4 span {
    color: #5e718b;
    font-size: 22px;
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;
}

.greeting-text5 {
    margin-top: 30px;
}

/* encount */
#encount {
    margin-top: 50px;
}

.encount-wrapper {
    position: relative;
    padding-bottom: 100px;
    background-image: url(//mindful-lifecareer.com/wp-content/themes/twentytwentythree-child/lp-img/online-mtg/encount-bg1.png), url(//mindful-lifecareer.com/wp-content/themes/twentytwentythree-child/lp-img/online-mtg/encount-bg2.png);
    background-position: left 0px bottom 0px, right 0px top 0px;
    background-size: 60%;
    background-repeat: no-repeat;
}

.encount-photo1 {
    width: 70%;
    margin-right: 0;
    margin-left: auto;
}

#encount .title {
    width: 65%;
    padding: 60px 0px 30px;
    background-color: #c3ad94;
    position: absolute;
    bottom: 20px;
    left: 0;
    background-image: url(//mindful-lifecareer.com/wp-content/themes/twentytwentythree-child/lp-img/online-mtg/encount-bg.png);
    background-repeat: no-repeat;
    background-size: 160px;
    background-position: top 10px left 50px;
}

#encount .title h2 {
    width: max-content;
    max-width: 100%;
    margin: 0 auto;
    font-size: 28px;
    color: #fff;
    line-height: 1.6em;
}

.encount-text {
    width: 80%;
    margin: 0 auto;
}

.encount-text p {
    margin-bottom: 20px;
}

.encount-text p:last-child {
    margin-bottom: 0px;
}

.encount-text1 {
    margin-top: 20px;
}

.encount-text2, .encount-text4 {
    margin-top: 30px;
}

.encount-text3 {
    margin-top: 0px;
}

.encount-text3 span {
    color: #5e718b;
    font-size: 18px;
    letter-spacing: .12em;
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;
    background: linear-gradient(to bottom, transparent 60%, rgb(94, 114, 139, .1) 60%);
}

.encount-text5 {
    text-align: center;
    margin-top: 50px;
}

.encount-text5 span {
    font-size: 22px;
    color: #af9476;
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;
}

.encount-text6 {
    margin-top: 30px;
}

/* future */

#future {
    margin-top: 80px;
    padding-bottom: 50px;
    background: linear-gradient(to bottom, transparent 420px, rgb(247, 236, 226, .3) 420px);
}

#future .title {
    padding-top: 80px;
    background: url(//mindful-lifecareer.com/wp-content/themes/twentytwentythree-child/lp-img/online-mtg/future-bg.png);
    background-size: 180px;
    background-repeat: no-repeat;
    background-position: top 20px left 50px;
}

#future .title h2 {
    font-size: 28px;
    color: #af9476;
    width: 85%;
    margin-left: 10%;
}

.future-text {
    width: 80%;
    margin: 0 auto;
}

.future-text p {
    margin-bottom: 30px;
}

.future-text p:last-child {
    margin-bottom: 0;
}

.future-text1 {
    margin-top: 40px;
}

.future-text2 {
    text-align: center;
    margin-top: 40px;
}

.future-text2 span {
    font-size: 22px;
    color: #39495e;
    background: linear-gradient(to bottom, transparent 40%, rgba(162, 191, 227, 0.1) 40%);
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;
}

.future-text3 {
    margin-top: 40px;
}




/* feature */

#feature {
    width: 70%;
    margin: 0 auto;
    margin-top: 60px;
    border: solid 1px #5e728b;
    padding-bottom: 30px;
}

#feature .title {
    text-align: center;
    margin-top: 30px;
}

#feature .title h2 {
    padding: 15px 0px 15px;
    color: #5e728b;
    font-size: 60px;
    font-family: "cormorant-garamond", serif;
    font-style: italic;
    letter-spacing: .02em;
}

#feature .title p {
    font-size: 16px;
    color: #AF9476;
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;

}

.feature-text1 {
    background: #5e728b;
    text-align: center;
    padding: 10px 0px;
}

.feature-text1 span {
    color: #fff;
}

.feature-text2 {
    text-align: center;
    margin-top: 30px;
}

.feature-text2 p, .feature-text3 p {
    line-height: 1.8;
    font-size: 18px;
}

.feature-text2 span:first-of-type {
    color: #AF9476;
    font-weight: 600;
}

.feature-text2 span:last-of-type {
    color: #5e718b;
    font-weight: 600;
}

.feature-photo2 {
    width: 70%;
    margin: 0 auto;
    margin-top: 10px;
}

.feature-text3 {
    text-align: center;
    margin-top: 20px;
}

.feature-text3 span {
    color: #af9476;
    font-weight: 600;
}

.feature-text4 {
    width: 85%;
    margin: 0 auto;
    margin-top: 30px;
}


/* comment */

#comments {
    width: 85%;
    margin: 0 auto;
    margin-top: 50px;
}

.comment-wrapper {
    width: 95%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    background: url(//mindful-lifecareer.com/wp-content/themes/twentytwentythree-child/lp-img/mail/comment-bg.png);
    background-repeat: no-repeat;
    background-position: left 30% top 50%;
    background-size: 60%;
    margin-bottom: 20px;
}

.comment-photo {
    width: 35%;
}

#comments .title {
    width: 58%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background-image: url(//mindful-lifecareer.com/wp-content/themes/twentytwentythree-child/lp-img/mail/voice-title2.png);
    background-repeat: no-repeat;
    background-position: top 45px left 0px;
    background-size: 150px;
}

#comments .title span {
    font-size: 18px;
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;
    color: #4c5d7b;
}

#comments .title h2 {
    font-size: 30px;
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;
    color: #4c5d7b;
}

#comments .title span .mindful {
    color: #AF9476;
}

.comment {
    width: 80%;
    margin: 0 auto;
    border-radius: 30px;
    padding: 20px 0px;
    margin-bottom: 30px;
    position: relative;
}

.comment-text {
    width: 90%;
    margin: 0 auto;
}

.comment-text p {
    color: #fff;
    font-size: 15px;
    line-height: 1.8;
}

.comment1, .comment3, .comment5 {
    background-color: #c3ad94;
}

.comment2, .comment4 {
    background-color: #5e728b;
}

.commnet5 {
    margin-bottom: 0;
}

.comment1::after, .comment3::after, .comment5::after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 0 30px 30px;
    border-color: transparent transparent #c3ad94 transparent;
    transform: rotate(-35deg);
    display: block;
    position: absolute;
    right: 40px;
    bottom: -5px;
}

.comment2::after, .comment4::after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 0 30px 30px;
    border-color: transparent transparent #5e728b transparent;
    transform: rotate(-35deg);
    display: block;
    position: absolute;
    right: 40px;
    bottom: -5px;
}

.comment-circle {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #d9e3ef;
    margin: 0 auto;
    display: block;
    margin-top: 20px;
}

.comment-circle2 {
    margin-top: 10px;
}

.comment-text2 , .comment-text3 , .comment-text4 , .comment-text5 , .comment-text6, .comment-text7{
    width: 95%;
    margin: 0 auto;
    margin-top: 50px;
}

.comment-text3, .comment-text4, .comment-text5, .comment-text6, .comment-text7 {
    margin-top: 20px;
}

.comment-text3 span {
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;
    color: #5e718b;
    background: linear-gradient(to bottom, transparent 60%, rgb(94, 114, 139, .1) 60%);
    letter-spacing: .1em;
    font-size: 28px;
}

.comment-text6 ul {
    max-width: 100%;
    width: max-content;
    margin: 0 auto;
}

.comment-text6 ul li {
    font-size: 15px;
    padding-bottom: 5px;
    color: #5e718b;
    position: relative;
    padding-left: 30px;
    list-style: none;
}

.comment-text6 ul li::after {
    content: "●";
    position: absolute;
    left: 0;
    top: 0;
    color: #d9e3ef;
}


/* steps */

#steps {
    width: 100%;
    margin: 0 auto;
    margin-top: 20px;
    margin-bottom: 50px;
    padding: 50px 0px;
    background: rgb(235, 243, 248, .5);
}

.step-text1 {
    text-align: center;
}

.step-text1 p {
    color: #5e718b;
    font-size: 18px;
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;
}

#steps .title {
    text-align: center;
}

#steps .title h2 {
    font-size: 60px;
    color: #5e718b;
    font-family: "cormorant-garamond", serif;
    letter-spacing: .02em;
    font-style: italic;
}

#steps .title span:first-of-type {
    color: #5e718b;
    font-size: 16px;
    font-weight: 600;
}

#steps .title-inner {
    text-align: center;
    background: url(//mindful-lifecareer.com/wp-content/themes/twentytwentythree-child/lp-img/mail/steps-bg.png);
    background-size: 60px;
    background-position: top 75% left 50%;
    background-repeat: no-repeat;
}


#steps .title-inner .number {
    font-size: 55px;
    color: #b79f83;
    font-family: "cormorant-garamond", serif;
    letter-spacing: .02em;
    font-style: italic;
}

#steps .title-inner span {
    color: #b79f83;
    font-size: 60px;
    font-family: "linotype-didot", serif;
    font-style: italic;
    line-height: 1em;
    letter-spacing: .02em;
}

#steps .title-inner .text {
    font-size: 28px;
    color: #b79f83;
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;
    padding-left: 5px;
    letter-spacing: .1em;
}

#steps .title-inner .text span {
    font-size: 20px;
    color: #b79f83;
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;
}

#steps .title-inner p {
    padding-top: 50px;
    text-align: center;
    color: #39495e;
    font-weight: 600;
}

.step {
    width: 70%;
    margin: 0 auto;
    background: #fff;
    padding: 30px 0px;
    border: solid 1px #5e718b;
}

.step1 {
    margin-top: 30px;
}

.step2, .step3 {
    margin-top: 40px;
}

.step-number {
    text-align: center;
}

.step-number span {
    font-family: "cormorant-garamond", serif;
    letter-spacing: .02em;
    font-style: italic;
    color: #b79f83;
    font-size: 55px;
    line-height: 1em;
}

.step-number span:last-of-type {
    font-size: 60px;
    font-family: "linotype-didot", sans-serif;
    margin-left: 5px;
}

.step-title {
    text-align: center;
    margin-top: 20px;
}

.step-title span {
    color: #5e718b;
    font-size: 14px;
}

.step-title h3 {
    color: #5e718b;
    font-size: 26px;
    letter-spacing: .1em;
}

.step-photo {
    width: 70%;
    margin: 0 auto;
    margin-top: 20px;
}

.step-text2 {
    width: 70%;
    margin: 0 auto;
    text-align: center;
    margin-top: 20px;
    padding: 5px;
    background: #39495e;
}

.step-text2 span {
    font-size: 18px;
    color: #fff;
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;
}

.step-text3 {
    margin-top: 20px;
}

.step-text3 ul {
    max-width: 100%;
    width: max-content;
    margin: 0 auto;
}

.step-text3 ul li {
    font-size: 14px;
    color: #5e718b;
    position: relative;
    padding-left: 30px;
    list-style: none;
}

.step-text3 ul li::after {
    content: "■";
    position: absolute;
    left: 0;
    top: 0;
}



/* profile */
#profile {
    background: rgb(247, 236, 226, .3);
    padding: 70px 0px;
    margin-top: 50px;
}

.profile-photo1 {
    width: 70%;
    margin: 0 auto;
}

.name {
    text-align: center;
    margin-top: 40px;
}

.name span {
    color: #5e718b;
    font-size: 14px;
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;
}

.name h2 {
    color: #5e718b;
    font-size: 26px;
    letter-spacing: .2em;
}

.profile-text {
    width: 80%;
    margin: 0 auto;
}

.profile-text1 {
    margin-top: 40px;
}

.profile-text p {
    margin-bottom: 15px;
    font-size: 14px;
}

.profile-text p:last-child {
    margin-bottom: 0;
}

.profile-text2, .profile-text3 {
    margin-top: 30px;
}

.profile-title span {
    font-size: 18px;
    color: #af9476;
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;
}

.profile-text2 ul li {
    color: #39495e;
    font-size: 14px;
    padding-left: 25px;
    position: relative;
    list-style-type: none;
}

.profile-text2 ul li::after {
    content: "■";
    position: absolute;
    left: 0;
    top: 0;
}

.profile-text2 ul {
    margin-top: 15px;
}

.magazine-wrapper {
    display: flex;
    justify-content: space-between;
    margin-top: 15px;
}

.magazine {
    width: 32%;
}

.magazine-text {
    text-align: center;
    margin-top: 15px;
}

.magazine-text span {
    display: block;
    color: #af9476;
    font-size: 12px;
}

.magazine-text span:last-of-type {
    font-size: 12px;
    margin-top: 10px;
}

.magazine-text span:nth-of-type(2) {
    font-size: 18px;
    line-height: 1.4;
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;
}

.magazine-text span:last-of-type {
    font-size: 12px;
    line-height: 1.6;
}

.magazine3 .font-small {
    margin-top: 0;
}


/* footer */
.footer {
    text-align: center;
    padding: 20px 0px;
}

.footer span {
    font-size: 10px;
    color: #fff;
    display: block;
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;
}

.footer span a {
    font-size: 10px;
    color: #fff;
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;
}

.copy-right {
    font-size: 10px;
    color: #fff;
    font-family: 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', sans-serif;
}


.tb-br {
    display: none;
}

.sp-br {
    display: none;
}

.sp-photo {
    display: none;
}

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

    .contents-wrapper {
        width: 97%;
    }

    /* mail-wrapper */
    .mail-wrapper {
        width: 85%;
    }

    .input.text.input_unit.required {
        width: 70%;
        margin-top: 10px;
    }

    input[type="submit"] {
        width: 70%;
        height: 60px;
        margin-top: 10px;
    }

    .mail-form-text1 p {
        line-height: 1.4;
    }


    /* foryou */

    #foryou {
        width: 85%;
    }

    /* voices */
    #voices {
        width: 85%;
    }

    #voices .title h2 {
        font-size: 26px;
    }

    #voices .title span {
        font-size: 24px;
    }

    .voice-name {
        padding: 10px 0px 5px;
    }

    .voice-content p {
        font-size: 14px;
    }

    .voice-content {
        padding: 20px 0px;
    }

    .job {
        line-height: 1.4;
    }

    /* greeting */
    #greeting .title {
        background-size: 110px;
        background-position: top 15px left 30px;
    }

    #greeting .title h2 {
        font-size: 24px;
    }

    .greeting-text {
        width: 85%;
    }

    /* encount */
    #encount .title {
        background-size: 130px;
        background-position: top 10px left 50px;
    }

    #encount .title h2 {
        font-size: 24px;
    }

    .encount-wrapper {
        padding-bottom: 80px;
    }

    .encount-text {
        width: 85%;
    }

    /* future */

    #future {
        margin-top: 50px;
        margin-top: 50px;
    }

    #future .title {
        background-size: 140px;
    }

    #future .title h2 {
        font-size: 24px;
        margin: 0 auto;
        line-height: 1.6;
    }

    .future-text {
        width: 85%;
    }

    .future-text2 {
        margin-top: 20px;
    }

    .future-text3 {
        margin-top: 20px;
    }

    /* future */
    #feature {
        width: 85%;
    }

    /* comments */

    #comments {
        width: 100%;
    }

    .comment-wrapper {
        width: 90%;
    }

    .comment-photo {
        width: 40%;
    }

    #comments .title {
        width: 55%;
    }

    #comments .title span {
        font-size: 14px;
        line-height: 1.8;
    }

    #comments .title h2 {
        font-size: 24px;
    }

    .comment-text p {
        font-size: 14px;
    }

    .comment-text2, .comment-text3, .comment-text4, .comment-text5, .comment-text6, .comment-text7{
        width: 85%;
    }

    /* step */

    .step {
        width: 85%;
        padding: 30px 0px 20px;
    }

    .step-title {
        margin-top: 20px;
    }

    .step-text3 {
        margin-top: 20px;
    }

    /* profile */

    #profile {
        padding: 50px 0px;
    }

    .name {
        margin-top: 20px;
    }

    .profile-text {
        width: 85%;
    }

    .profile-text2 ul {
        margin-top: 10px;
    }

    .magazine-text span:nth-of-type(2) {
        font-size: 16px;
    }

    .magazine-wrapper {
        margin-top: 5px;
    }

    .pc-br {
        display: none;
    }

    .tb-br {
        display: block;
    }
}

@media screen and (max-width:700px) {
    p, li {
        font-size: 14px;
        letter-spacing: .12em;
    }

    .program-text .font-bold, .concept-text .p-under, .case-text .b-under, .case-text .p-under, .greeting-text .p-under, .greeting-text .b-under {
        line-height: 1.8;
        letter-spacing: .08em;
    }

    .pc-kv {
        display: none;
    }

    .sp-kv {
        display: block;
    }

    .mail-form-photo {
        margin-top: 20px;
    }

    form.myForm input[type="text"], form.myForm input[type="password"] {
        font-size: 12px;
        border: solid 1px #426279 !important;
        width: calc(97% - 20px - 2.8px) !important;
    }

    .input.text.input_unit.required {
        width: 90%;
        margin-top: 5px;
    }

    form.myForm div.submit {
        margin-top: 10px !important;
    }


    input[type="submit"] {
        width: 90%;
        height: 50px;
        font-size: 15px;
        margin-top: 0;
        background-image: unset;
    }

    .mail-form-text.mail-form-text2 {
        margin-top: 10px;
    }


    /* mail-form */

    .mail-wrapper1 {
        margin-top: 10px;
        padding: 15px 0;
    }

    .mail-form {
        margin-top: 0px;
        padding: 10px 0px;
    }

    .mail-form-title {
        margin-top: 0;
    }

    .mail-form-text.mail-form-text1 p {
        font-size: 20px;
    }

    .mail-form-text1 span {
        font-size: 22px;
    }

    .mail-form-text1 .font-small {
        font-size: 16px;
    }

    .mail-form-text1 p span:first-of-type {
        font-size: 50px;
    }

    .mail-form-text1 p span:nth-of-type(2) {
        font-size: 45px;
    }

    .mail-form-title span {
        font-size: 28px;
    }

    .form-wrapper {
        width: 100%;
        margin-top: 0px;
    }

    .mail-form-text.mail-form-text1 {
        margin-top: 0px;
    }

    .contents-wrapper {
        padding-bottom: 0;
    }

    .mail-wrapper1 .mail-form-photo1 {
        margin-top: 30px;
    }

    .mail-form-text2 p , .mail-form-text2 p span{
        font-size: 13px;
        letter-spacing: .1em;
    }

    /* mail-wrapper */
    .mail-wrapper {
        width: 95%;
    }

    .mail-wrapper2 {
        margin-top: 30px;
    }

    .mail-form-text2 {
        text-align: left;
        width: 80%;
        margin: 0 auto;
        padding: 30px 5% 10px;
    }

    .mail-form-text3 p {
        font-size: 18px;
    }

    .mail-form-text4 p {
        font-size: 12px;
        line-height: 1.6;
    }

    .mail-form-text4 p span {
        font-size: 18px;
        letter-spacing: .1em;
    }

    .mail-form-text-bg1 {
        top: -10px;
        left: -10px;
        width: 40px;
    }

    .mail-form-text-bg2 {
        bottom: -10px;
        right: -10px;
        width: 40px;
    }



    /* foryou */
    #foryou {
        width: 90%;
        padding: 50px 0px 20px;
        margin-top: 30px;
    }

    #foryou .title h2 {
        font-size: 18px;
    }


    /* voice */

    #voices {
        margin-top: 30px;
    }

    #voices .title h2 {
        font-size: 22px;
    }

    .voice-wrapper {
        display: block;
    }

    .voice {
        width: 100%;
    }

    .voice-right {
        margin-top: 30px;
    }

    /* greeting */

    #greeting {
        margin-top: 30px;
    }

    .greeting-photo1 {
        width: 90%;
    }

    #greeting .title {
        width: 90%;
        position: relative;
        top: -20px;
        margin-right: 0;
        margin-left: auto;
        padding: 60px 0px 20px;
    }

    .greeting-text p {
        margin-bottom: 15px;
    }

    .greeting-text1 {
        margin-top: 10px;
    }

    .greeting-text2 {
        margin-top: 30px;
    }

    .greeting-photo2 {
        margin-top: 20px;
    }

    #greeting .title h2 {
        font-size: 18px;
        line-height: 1.6;
    }

    .greeting-wrapper {
        padding-bottom: 0px;
    }

    .greeting-text2 p {
        font-size: 18px;
    }

    .greeting-text3 {
        margin-top: 30px;
    }

    .greeting-text4 span {
        font-size: 16px;
    }

    /* encount */

    #encount {
        margin-top: 30px;
    }

    .encount-wrapper {
        padding-bottom: 0px;
    }

    .encount-photo1 {
        width: 90%;
    }

    #encount .title {
        width: 90%;
        margin-left: 0;
        margin-right: auto;
        position: relative;
        top: -20px;
        background-position: top 10px left 10px;
    }

    #encount .title h2 {
        font-size: 18px;
    }

    .encount-text1 {
        margin-top: 10px;
    }

    .encount-text p {
        margin-bottom: 15px;
    }

    .encount-text3 span {
        font-size: 16px;
    }

    .encount-text2, .encount-text4 {
        margin-top: 20px;
    }

    .encount-text5 {
        margin-top: 20px;
    }

    .encount-text5 span {
        font-size: 16px;
    }

    .encount-text6 {
        margin-top: 20px;
    }

    /* future */

    #future {
        margin-top: 30px;
        padding-bottom: 30px;
        background: linear-gradient(to bottom, transparent 50px, rgb(247, 236, 226, .3) 50px);
    }

    #future .title {
        background-position: top 20px left 10px;
    }

    .future-text1 {
        margin-top: 20px;
    }

    .future-text p {
        margin-bottom: 15px;
    }

    #future .title h2 {
        font-size: 18px;
    }

    .future-text2 span {
        font-size: 18px;
    }

    /* feature */

    #feature {
        margin-top: 30px;
        width: 90%;
    }

    #feature .title p {
        font-size: 12px;
    }

    #feature .title {
        margin-top: 20px;
    }

    #feature .title h2 {
        padding: 10px 0px;
        font-size: 30px;
    }

    .feature-text1 span {
        font-size: 12px;
    }

    .feature-text2 p, .feature-text3 p {
        font-size: 14px;
    }

    .feature-text2 {
        width: 90%;
        margin: 0 auto;
        margin-top: 30px;
    }

    .feature-text3 {
        width: 90%;
        margin: 0 auto;
        margin-top: 20px;
    }

    .feature-photo2 {
        width: 80%;
    }

    /* comments */

    #comments {
        margin-top: 30px;
    }

    .comment-wrapper {
        display: block;
        margin-bottom: 0;
        width: 100%;
    }

    .comment {
        width: 100%;
    }

    .comment-photo {
        width: 75%;
        margin: 0 auto;
        margin-bottom: 10px;
    }

    #comments .title {
        width: 100%;
        padding: 40px 0 20px;
        background-position: top 3px left 10px;
        background-size: 100px;
    }

    #comments .title h2 {
        font-size: 20px;
        text-align: center;
    }

    #comments .title span {
        font-size: 14px;
        text-align: center;
    }

    .comment-text p {
        font-size: 13px;
        letter-spacing: .1em;
    }

    .comment {
        width: 90%;
    }

    .comment-text3 span {
        font-size: 20px;
    }

    .comment-text6 ul li {
        font-size: 14px;
        letter-spacing: .1em;
        padding-bottom: 10px;
    }

    .comment-text3, .comment-text4, .comment-text5, .comment-text6, .comment-text7 {
        margin-top: 15px;
    }

    /* steps */

    #steps {
        margin-bottom: 30px;
        padding: 30px 0px;
    }

    #steps .title h2 {
        font-size: 34px;
        margin-top: 5px;
    }

    #steps .title span:first-of-type {
        font-size: 12px;
    }

    .step-text1 p {
        font-size: 14px;
    }

    #steps .title-inner .number {
        font-size: 38px;
        line-height: 1em;
        margin-top: 20px;
    }

    #steps .title-inner .text {
        font-size: 18px;
        padding-left: 5px;
    }

    #steps .title-inner span {
        font-size: 55px;
    }

    #steps .title-inner {
        background-position: top 58% left 50%;
    }

    #steps .title-inner .text span {
        font-size: 14px;
    }

    .step-title span {
        font-size: 12px;
        letter-spacing: .1em;
        display: inline-block;
        line-height: 1.6;
    }

    .step {
        width: 90%;
        padding: 20px 0px;
    }

    .step-number span {
        font-size: 40px;
    }

    .step-number span:last-of-type {
        font-size: 50px;
    }

    .step-title h3 {
        font-size: 22px;
        margin-top: 5px;
    }

    .step-title {
        margin-top: 15px;
    }

    .step-text3 ul {
        width: 90%;
    }

    .step-text3 ul li {
        line-height: 1.6;
        margin-bottom: 5px;
        font-size: 12px;
        padding-left: 25px;
    }

    .step-photo {
        width: 90%;
    }

    .step-text2 {
        width: 97%;
    }

    .step-text2 span {
        font-size: 14px;
    }

    .step2, .step3 {
        margin-top: 20px;
    }

    /* profile */
    #profile {
        padding: 30px 0px;
    }

    .profile-text1 {
        margin-top: 20px;
    }

    .profile-photo1 {
        width: 100%;
    }

    .profile-text2 ul li {
        font-size: 12px;
    }

    .profile-text2, .profile-text3 {
        margin-top: 20px;
    }

    .magazine-wrapper {
        display: block;
    }

    .magazine {
        width: 100%;
    }

    .magazine2, .magazine3 {
        margin-top: 30px;
    }

    .magazine-text span:last-of-type {
        margin-top: 10px;
    }

    .magazine-text span:nth-of-type(2) {
        font-size: 18px;
    }

    .magazine-photo {
        width: 80%;
        margin: 0 auto;
    }

    .magazine-text {
        margin-top: 10px;
    }


    .tb-br {
        display: none;
    }

    .sp-br {
        display: block;
    }

}