@charset "utf-8";

/*-----------------------------

　リセットCSS + サイト共通設定

------------------------------*/

/*====================================================================================*/
/*	COURSE / 講座メニュー
/*====================================================================================*/
/*------------------------------------------*/
/*	はじめてのNLP心理学体験セミナー / course_new
/*------------------------------------------*/
.course .course_top_frame h2 {
    height: 420px;
    padding-top: 200px;
    padding-right: 32%;
    box-sizing: border-box;
    font-size: x-large;
    font-family: "Yu Mincho", "YuMincho", "游ゴシック", "Yu Gothic",sans-serif, "Hiragino Kaku Gothic Pro", "Meiryo", "sans-serif";
    text-align: right;
    background: url(../images/course_top_bk.png);
    background-size: cover;
}

.course .new_frame,
.course .practice_frame,
.course .master_frame,
.course .voice_frame{
    padding: 83px 0 100px 0;
    background-image: url(../images/course_bk.png);
    background-size: cover;
}


.course .practice_frame .practice_contents_textbox > a ,
.course .master_frame .master_contents_textbox > a{
    display: block;
    width: 490px;
    margin: 75px auto 0;
    padding: 15px 0;
    font-size: 20px;
    text-align: center;
    background: #ad5c6f;
    color: #FFF;
}

.course h3 {
    margin-bottom: 53px;
    font-size: 22px;
    font-weight: normal;
    text-align: center;
}

.course h3 span {
    display: inline-block;
    padding: 0 25px 10px 25px;
    border-bottom: 1px solid #ea9395;
}

.course h4 {
    width: 984px;
    margin: 0 auto 9px;
    font-size: 18px;
    color: #ea9395;
    font-weight: bold;
}

.course .txt_box {
    position: relative;
    width: 1034px;
    margin: 0 auto;
}

.course .txt_box p {
    position: relative;
    top: 45px;
    width: 464px;
    padding: 10px 22px;
    background: rgba(252,238,235,0.46);
    z-index: 999;
    box-sizing: border-box;
}

.course .txt_box p span {
    font-weight: bold;
    color: #ad5c6f;
}

.course .txt_box img {
    position: absolute;
    right: 0;
}

.course .recommend {
    width: 984px;
    margin: 145px auto 45px auto;
    padding: 17px 35px 24px 32px;
    border: 1px solid #ea9395;
    box-sizing: border-box;
}

.course .recommend ul:nth-child(1) {
    margin-right: 10px;
}

.course .recommend ul li {
    position: relative;
    padding-left: 1em;
}

.course .recommend ul li:before {
    position: absolute;
    left: 0;
    top: 0;
    display: block;
    content: "・";
    width: 1em;
    height: 1em;
}

.course .box {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
}

.course .course_detail {
    width: 984px;
    margin: 10px auto 0;
    padding: 10px 18px;
    box-sizing: border-box;
}

.course .course_detail dl {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    flex-wrap: wrap;
    box-sizing: border-box;
    padding-right: 10px;
}

.course .course_detail dt,
.course .course_detail dd {
    padding-left: 0;
}

.course .course_detail dd:nth-child(2) {
    padding-left: 20px;
}

.course .course_detail dt {
    color: #ea9395;
}

.course .course_detail dt {
    width: 16%;
}

.course .course_detail dd {
    width: 84%;
    margin-bottom: 24px;
}

.course .course_detail dt:nth-child(1),
.course .course_detail dd:nth-child(2){
    width: 100%;
}

.course .course_detail dd ol li {
    counter-increment: cnt;
}

.course .course_detail dd ol li:before {
    content: counter(cnt) ") ";
}

.course .course_detail dd a{
    display: inline-block;
    margin-left: 17px;
    padding: 1px 10px;
    font-size: 12px;
    color: #FFF;
    border-radius: 5px;
    background: #ea9395;
}

/*------------------------------------------*/
/*	全米NLP協会公認「プラクティショナー」認定コース（資格取得講座） / course_practice
/*------------------------------------------*/
.practice_frame {
    background-color: #fdf9f8;
}

.course .practice_frame .txt_box {
    width: 984px;
}

.course .practice_frame .txt_box p {
    top: 85px;
    width: 437px;
    padding: 38px 22px;
    background: rgba(255,255,255,0.46);
}

.course .practice_frame .recommend {
    margin-top: 232px;
    background: #FFF;
}

.course .practice_frame .course_detail {
    background: #FFF;
}

/*------------------------------------------*/
/*	全米NLP協会公認「マスタープラクティショナー」認定コース（資格取得講座） / course_master
/*------------------------------------------*/
.course .master_frame {
    background-color: #fefdfd;
}

.course .master_frame .txt_box {
    width: 990px;
}

.course .master_frame .txt_box p {
    top: 53px;
    width: 455px;
    padding: 24px 22px;
    background: rgba(173,92,111,0.15);
}

.course .master_frame .recommend {
    margin-top: 189px;
    border: 1px solid #ad5c6f;
    background: #FFF;
}

.course .master_frame h4 {
    color: #ad5c6f;
}

.course .master_frame .course_detail {
    background: #FFF;
}

.course .master_frame dt {
    color: #ad5c6f;
}

/*------------------------------------------*/
/*	はじめてのNLP心理学体験セミナー / course_new
/*------------------------------------------*/
.course .voice_frame {
    background-color: #fdf9f8;
}

.course .voice_box:nth-child(2){
    background-image: url(../images/course_voice_bk1.png);
    background-position: bottom 26px left 50px;
}

.course .voice_box:nth-child(3){
    background-image: url(../images/course_voice_bk2.png);
    background-position: bottom 29px right 447px;
}

.course .voice_box:nth-child(4){
    background-image: url(../images/course_voice_bk3.png);
    background-position: bottom 18px left 64px;
}
.course .voice_box:nth-child(5){
    background-image: url(../images/course_voice_bk4.png);
    background-position: bottom 29px right 447px;
}
.course .voice_box:nth-child(6){
    background-image: url(../images/course_voice_bk5.png);
    background-position: bottom 29px right 447px;
}
.course .voice_box:nth-child(7){
    background-image: url(../images/course_voice_bk6.png);
    background-position: top 99px right 444px;
}

.course .voice_box {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: space-between;
    width: 1120px;
    margin: 0 auto 30px;
    padding: 40px;
    box-sizing: border-box;
    background: #FFF;
    background-repeat: no-repeat;
}

.course .voice_box h4 {
    text-align: left;
}

.course .voice_box .voice_txt {
    width: 630px;
}

.course .voice_box figure {
    margin: 0;
}

.course .voice_box figure img {
    margin-bottom: 10px;
}

.course .voice_box figcaption {
    font-size: 26px;
    text-align: center;
}

.course .voice_frame .voice_contents_textbox > a{
    display: block;
    width: 560px;
    margin: 75px auto 0;
    padding: 15px 0;
    font-size: 20px;
    text-align: center;
    background: #e98e78;
    color: #FFF;
}

/*----------- sp.css -----------*/
@media screen and (max-width:768px){
    .course .course_top_frame h2 { 
        height: 248px;
        font-weight: normal;
        padding: 107px 10% 0 0;
        font-size: 28px;
        background-position-x: -101px;
    }
    .course .txt_box,
    .course .txt_box p,
    .course .txt_box img{
        position: inherit;
        width: 100%;
    }
    .course .txt_box img {
        margin-bottom: 25px;
    }
    .course .recommend,
    .course .course_detail,
    .course .practice_frame .txt_box,
    .course .practice_frame .txt_box p,
    .course .master_frame .txt_box,
    .course .master_frame .txt_box p,
    .course .course_detail dt,
    .course .course_detail dd,
    .course .practice_frame .practice_contents_textbox > a,
    .course .master_frame .master_contents_textbox > a,
    .course .voice_box,
    .course .voice_box .voice_txt,
    .course h4,
    .course .voice_frame .voice_contents_textbox > a{
        width: 100%;
    }
    .course .new_frame,
    .course .practice_frame,
    .course .master_frame,
    .course .voice_frame {
        padding: 50px 20px;
    }
    .course .practice_frame .practice_contents_textbox > a,
    .course .master_frame .master_contents_textbox > a,
    .course .voice_frame .voice_contents_textbox > a{
        margin-top: 30px;
    }
    .course .box,
    .course .voice_box{
        flex-direction: column;
    }
    .course .recommend,
    .course .practice_frame .recommend,
    .course .master_frame .recommend{
        margin-top: 30px;
    }
    .course .voice_box {
        padding: 20px;
    }
    .course .voice_box figure{
        margin-top: 20px;
    }
    .course .voice_box figure img {
        width: 100%;
    }
    

}