@charset "utf-8";

/*-------------------------------------------------------------------
    * style.css
    * site name :  チャンスイット
    * description : 初心者ページ
    * import :  /ci-camp/beginner/
-------------------------------------------------------------------*/

#beginner {
    font-family: "Meiryo","メイリオ","ＭＳＰゴシック","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",sans-serif;
    font-size:18px;
    color:#4e372d;
}
#beginner .wrap {
    width:1000px;
    margin:0 auto;
    text-align:center;
}
#beginner a{
    display:inline-block;
}
#beginner a:hover{
    text-decoration:none;
}
#beginner .main >  p{
    font-size:45px;
    font-weight: bold;
    line-height:1.4;
    text-align:center;
}
#beginner span{
    color:#f83f4c;
    font-weight:bold;
}

/* -----------------------コンテンツ設定 */

#beginner .header{
    border-bottom:#615b44 3px solid;
}
#beginner .header .head_area{
    width:1000px;
    margin:0 auto;
}

#beginner .title{
    background:url(../img/bg_title.png) center center no-repeat;
    text-align:center;
}
#beginner .content1 {
    background:url(../img/bg_content1.png) 0 bottom repeat-x;
}
#beginner .content1 p{
    line-height:40px;
    margin:20px 0 10px;
}
#beginner .content1 .wrap > img{
    margin:0 0 30px;
}
#beginner .content2{
    background:#ffefce;
    padding:20px 0 50px;
}
#beginner .content2  ul{
    overflow:hidden;
    width:756px;
    margin:30px auto;
}
#beginner .content2  li{
    float:left;
    margin:0 15px 15px 0;
}
#beginner .content2  li:nth-child(3n){
    margin:0 0 15px;
}
#beginner .content2  li a{
    width:240px;
    font-size:16px;
    color:#51392e;
    background:#fff;
    text-decoration:none;
    padding:20px 0 0;
    border:#51392e solid 1px;
}
#beginner .content2  li a h3{
    font-size:30px;
    color:#553d32;
    margin:0 0 15px;
    font-weight:bold;
    display:inline-block;
    padding:10px 0 0 50px;
}
#beginner .content2  li:nth-child(1) a h3{
    background:url(../img/icon_content2_1.png) -3px center no-repeat;
}
#beginner .content2  li:nth-child(2) a h3{
    background:url(../img/icon_content2_2.png) -3px center no-repeat;
}
#beginner .content2  li:nth-child(3) a h3{
    background:url(../img/icon_content2_3.png) -3px center no-repeat;
}
#beginner .content2  li:nth-child(4) a h3{
    background:url(../img/icon_content2_4.png) -3px center no-repeat;
}
#beginner .content2  li:nth-child(5) a h3{
    background:url(../img/icon_content2_5.png) -3px center no-repeat;
}
#beginner .content2  li:nth-child(6) a h3{
    background:url(../img/icon_content2_6.png) -3px center no-repeat;
}
#beginner .content2 li a .txt{
    height:45px;
    line-height:25px;
}
#beginner .content2 li a .area{
    color:#fff;
    margin:15px 0 0;
    padding:10px 0;
    background:#51392e;
}
#beginner .content2 li a:hover{
    transition: .2s linear;
    -webkit-transition: .2s linear;
    -moz-transition: .2s linear;
    -o-transition: .2s linear;
    -ms-transition: .2s linear;
    border:#f83f4c solid 1px;
}
#beginner .content2 li a:hover .area{
    transition: .2s linear;
    -webkit-transition: .2s linear;
    -moz-transition: .2s linear;
    -o-transition: .2s linear;
    -ms-transition: .2s linear;
    background:#f83f4c;
}
#beginner .content2 .mypage_btn:hover{
    transition: .2s linear;
    -webkit-transition: .2s linear;
    -moz-transition: .2s linear;
    -o-transition: .2s linear;
    -ms-transition: .2s linear;
    opacity:0.6;
}
#beginner .content3{
    background:url(../img/bg_content3.png) 0 0 repeat-x;
    padding:30px 0;
}
#beginner .content3 ul{
    overflow:hidden;
    width:824px;
    margin: -10px auto 10px;
}
#beginner .content3 li{
    float:left;
    margin:0 20px 0 0;
}
#beginner .content3 li:last-child{
    margin:0;
}
#beginner .content4{
    text-align:center;
}
#beginner .content4 h2{
    background:url(../img/bg_content4.png) 0 0 repeat-x;
    margin:0 0 40px;
}
#beginner .content4 p{
    line-height:50px;
}
#beginner .content4 span{
    font-size:30px;
}
#beginner .content5{
    margin:30px 0 0;
    padding:50px 0 0;
    background:#eaeaea;
}
#beginner .content6{
    text-align:center;
    background-color:#ffefce;
    background-image:url(../img/bg_content6_left.png), url(../img/bg_content6_right.png);
    background-position:0 top, right top;
    background-repeat:no-repeat, no-repeat;
    margin:0 0 50px;
}
#beginner .content6 p{
    background:#ffc438;
}
#beginner .content7{
    background:url(../img/bg_content7.png) 0 0 repeat-x;
    padding:30px 0;
    margin:0 0 50px;
}
#beginner .content7 .wrap{
    overflow:hidden;
}
#beginner .content7 .txt{
    margin:30px 0 0 0;
    line-height:40px;
}
#beginner .content7 .wrap > img,
#beginner .content7 .txt{
    float:left;
    text-align:left;
}
#beginner .content7 .wrap > img{
    margin:0 50px 0 0;
}
#beginner .content7 .box{
    background:#fff;
    line-height:35px;
    padding:14px;
    margin:20px 0 0;
    overflow:hidden;
}
#beginner .content7 .box img,
#beginner .content7 .box p{
    float:left;
}
#beginner .content7 .box img{
    margin:0 15px 0 0;
}
#beginner .content7 .box p{
    margin:10px 20px 0 0;
}

/* -----------------------button */

#beginner .button{
    width:890px;
    margin:50px auto;
    border:1px solid #c5c5c5;
    padding:40px 60px;
    font-size:30px;
    text-align:center;
    color:#51392e;
}
#beginner .button h2{
    color:#51392e;
}
#beginner .button ul{
    overflow:hidden;
    margin:30px 0 0;
    height:83px;
}
#beginner .button ul li{
    float:left;
    margin:0 0 10px 0;
}
#beginner .button li a{
    border-radius:8px;
    font-size:26px;
    padding:20px;
    color:#fff;
}
#beginner .button li:first-child a{
    width:450px;
    background:#03b97b;
    box-shadow:0px 8px 0px 0px #03645a;
    margin:0 40px 0 0;
}
#beginner .button li:last-child a{
    width:300px;
    background:#f83f4c;
    box-shadow:0px 8px 0px 0px #b0000c;
}
#beginner .button li:first-child a:hover{
    transition: .2s linear;
    -webkit-transition: .2s linear;
    -moz-transition: .2s linear;
    -o-transition: .2s linear;
    -ms-transition: .2s linear;
    margin:8px 40px 0 0;
    box-shadow:none;
    background:#03645a;
}
#beginner .button li:last-child a:hover{
    transition: .2s linear;
    -webkit-transition: .2s linear;
    -moz-transition: .2s linear;
    -o-transition: .2s linear;
    -ms-transition: .2s linear;
    margin:8px 0 0 0;
    box-shadow:none;
    background:#b0000c;
}
.fs_s {
    margin: 0 auto 6px;
    font-size: 10px;
    line-height: 1.5;
}
/* ---------------------------------------広告 */

#beginner #camp-guide-foot {
    height: 320px;
}
@media screen and (max-width:900px){
    #beginner {
        width: 100%;
        min-width: 960px;
        overflow:hidden;
  }
}