.main_visual {position:relative;z-index: 1; box-sizing: border-box;overflow: hidden;background-color: #e1e1e1;}
.bg01 img{ display: block; width:100%;  margin: 0 auto; position: relative;}
.bg02 img{ display:none;}
.title{position:absolute;top:-30px;}
.title img{width: 100%;}
.main_visual>a{ display:inline-block; padding: 10px 50px; background-color: rgba(000,000,000,.7); color: #de94ad; border-radius: 30px;position: absolute;top:35%;left:50%;margin-left:-15%;font-size: 1.4em; border:2px solid #de94ad;}
.main_visual>a:hover{background-color:#de94ad;color: #333;}
.bg02{width: 100%; background-image: url(../images/event_images/bg.jpg); background-size:contain;background-repeat: no-repeat; background-position: bottom center;position: relative;}

.text_box , .result_box{ display:block; position:relative;top:0;right:0;bottom:0;left:0;margin:auto;z-index:3;width:60%;height: auto; background-color:#3e3e3e;border-radius: 20px;margin-top:50px;margin-bottom: 50px; text-align: center;padding: 60px 100px;box-shadow: 0px 0px 7px rgba(0,0,0,.2);border:5px solid #dbc3cb;box-sizing: border-box;}
.text_box h2{display: block; font-size: 1.8em; font-weight: 500; color:#dbc3cb;width: 80%; margin: 0 auto;}
.simple_img{display: block; width:55%;height: auto;margin: 0 auto;margin-top:30px;box-shadow: 0px 0px 7px rgba(0,0,0,.2);overflow: hidden;}
.simple_img img{width: 100%;}
.text_box a{display:inline-block; text-align: center; padding: 10px; color:#fff;margin: 10px; font-size: 1.2em;position:relative;top:70px;margin-bottom: 50px;}
.text_box a span{display: inline-block; height: 40px; width: 40px;line-height: 40px; border-radius: 50%;  background-color: #6e9793;position: absolute;top:0;right:0;bottom:0;left:0;margin:auto;top: -85px;border:5px solid;border-color:rgba(52,79,109,.5);}
.text_box a:hover{color:#d27d98;top:60px;}
.text_box a:hover span{background-color: #d27d98; color: #fff;}

.result_box{padding:50px;}
.result_box section{ display:block; width:100%;overflow: hidden;text-align: left;}
.result_box img{width: 100%;}
.result_img{display:inline-block;width:35%; height:0; padding-bottom:22%;  margin-right:20px;box-sizing:border-box;border:7px solid; border-color: rgba(255,255,255,.5);overflow: hidden;}
.result_description{display:inline-block; width:60%;margin-left: 0px;float:right;color: #fff;}
.result_box strong{ color: #dbc3cb; font-size: 1.3em;font-weight: 500;}
.result_box section+section{margin-top: 30px;}
.result_description h2{font-size: 2.25em;}
.result_description a{ display: inline-block; text-align: center; padding: 5px 30px; border:1px solid #d27d98;color: #d27d98;border-radius: 20px;margin: 20px 0 0 20px;font-weight: 500; font-size: 1.2em;float: right;}
.result_description a:hover{background-color:#d27d98; color: #fff;}

.recommend_box{background-color: #e1e1e1; padding: 20px; box-sizing: border-box;overflow: hidden;margin-top: 10px;}
.recommend_box a:hover{color:#d27d98; }
.recommend_designer{display: inline-block;width:25%;text-align: center;padding: 10px 20px;float: left;border-right:1px dotted #c7c7c7;box-sizing: border-box;}
.recommend_designer a{display: block;box-sizing: border-box; color: #333;font-weight: 500;}
.recommend_designer a img{width: 130px; height: 130px; border-radius: 50%;border:8px solid; border-color: rgba(255,255,255,.5); margin: 0 auto;box-shadow: 0px 0px 7px rgba(0,0,0,.2);}
.recommend_project{display: inline-block;width:72%;float: right;}
.recommend_img a{display:block;width:45%;height:auto;overflow:hidden;float:left;margin-right: 20px;}
.project_article a{display: inline-block; width: 51%;float:right;color:#333; }
.project_article h3{font-size: 1.3em;font-weight: 600; margin-bottom:10px;}



@media screen and (max-width:1366px) and (min-width:1025px){
    .text_box , .result_box{width:80%;}
    .recommend_designer{width:25%;padding: 10px;}
}

@media screen and (max-width:1024px) and (min-width:769px){
   .text_box , .result_box{padding:30px 10px;}
   .recommend_designer a img{width: 120px; height: 120px; border-width:4px;}
    .result_img{width:100%;padding-bottom:64%; }
    .result_description{width:100%;float:none;}
    .recommend_designer{width:100%;}
    .recommend_project{width:100%;float: none;margin-top:30px;}
    .recommend_img a{width:100%;float:none;margin-right:0px;}
    .project_article a{ width: 100%;}
}

@media screen and (max-width:768px) and (min-width:640px){
    .title{width: 110%;margin-top: 20px;}
    .main_visual>a{ padding: 10px 33px; ;font-size: 1em; top:39%;}
    .text_box , .result_box{width:80%;padding: 20px;}
    .text_box h2{font-size: 1.4em; width: 90%;}
    .simple_img{margin-top:20px;}
    .text_box a{padding:5px;margin:10px 20px; font-size: 1.2em;top:0px;margin-bottom:0px;}
    .text_box a:hover{top:0px;}
    .text_box a span{position:relative;top:0px;margin-right: 5px;width: 30px;height: 30px;line-height: 30px;}    
    .result_img{width:100%;padding-bottom:64%; }
    .result_description{width:100%;float:none;}
    .recommend_designer{width:100%;}
    .recommend_project{width:100%;margin-top:30px;}
    .recommend_img a{width:100%;float:none;margin-right:0px;}
    .project_article a{ width: 100%;}
}

@media screen and (max-width:639px) and (min-width:320px){
    .title{width: 180%;margin-top:50px;margin-left:-120px;}
    .bg01 img{ display: none;}
    .bg02 img{ display:block;}  /*---------0207--------*/
    .main_visual>a{ padding:5px 20px;font-size:1em; top:28%;}
    .text_box , .result_box{width:90%;padding:10px;}
    .text_box h2{font-size: 1.2em; width:90%;}
    .simple_img{margin-top:10px; }
    .text_box a{display: block;font-size: 1em;top:0px;margin-bottom:0px;}
    .text_box a:hover{top:0px;}
    .text_box a span{position:relative;top:0px;margin-right: 5px;width:25px;height:25px;line-height:25px;}
    .result_img{width:100%;padding-bottom:64%; }
    .result_description{width:100%;float:none;}
    .recommend_designer{width:100%;}
    .recommend_project{width:100%;margin-top:30px;}
    .recommend_img a{width:100%;float:none;margin-right:0px;}
    .project_article a{ width: 100%;}    
}

/*---------0207--------*/
@media screen and (max-width:414px) and (min-width:414px){
.main_visual>a{  top:25%;}    }

@media screen and (max-width:375px) and (min-width:375px){
.title{width: 200%;margin-left:-130px;}
.main_visual>a{  top:25%;} }

@media screen and (max-width:320px) and (min-width:320px){
.title{width: 200%;margin-left:-110px;}
.main_visual>a{  top:22%;} }
/*---------0207--------*/

/*¤À¨É¤¸¥ó*/
.fb_share {
    position: absolute;
    right: 0;
    margin-top: -40px;
    margin-right: 100px;
}

.fb_base, .line_base {
    float: left;
    display: inline-block;
}

.line_base {    
    display: inline-block;
}

.share {
    position: absolute;
    right: 0;
    margin-top: 50px;
    margin-right: 200px;
    z-index: 99;
}

@media (min-width:320px) and (max-width: 1024px) {    
    .share {
        display: inline-block;
        position: absolute;
        right: 0;
        margin-top: 10px;
        margin-right: 5px;
        z-index:99;
    }
}