@charset "utf-8";



/*****************************************************************************************************

フィーチャー

******************************************************************************************************/

.feature {

    background: url("../images/home/feature_bg.jpg") no-repeat center bottom;

    background-size: cover;

    box-sizing: border-box;

    padding: 35px;

    display: table;

    width: 100%;

    height: 450px;

}

.feature > div {

    background-color: rgba(255,255,255,0.85);

    display: table-cell;

    vertical-align: middle;

    text-align: center;

}



img.feature_title {

    width: 525px;

}

img.feature_title_sp {

    display: none;

}



.feature_summary {

    font-size: 87.5%;/*14*/

    font-weight: 600;

    margin-top: 45px;

}



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

    .feature {

        padding: 25px;

    }

    img.feature_title {

        display: none;

    }

    img.feature_title_sp {

        display: inline;

        width: 250px;

    }

    .feature_summary {

        font-size: 81.3%;/*13*/

    }

}













/*****************************************************************************************************

カウントダウン

******************************************************************************************************/

#countOutput {

    background-color: #FAFAFA;

    border-bottom: solid 1px #DDD;

    text-align: center;

    padding: 10px 15px;

}













/*****************************************************************************************************

Claris Japan Excellence Award

******************************************************************************************************/

.award {

    display: table;

    width: 100%;

    background-color: #2C2C2E;

}



.award_text {

    display: table-cell;

    width: 55%;

    

    color: #FFF;

    text-align: center;

    box-sizing: border-box;

    padding: 75px 15px;

}



.award_text h2 {

    font-size: 125%;/*20*/

    margin-bottom: 1em;

    

    display: inline-block;

    background: linear-gradient(135deg, #D9A300 0%, #FFE67B 100%);

    background: -webkit-linear-gradient(-45deg, #D9A300 0%, #FFE67B 100%);

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

}

.award_text h3 {

    font-weight: 300;

    font-size: 93.8%;/*15*/

    margin-top: 1em;

}

.award_text p {

    font-size: 93.8%;/*15*/

}



.award_img {

    display: table-cell;

    width: 45%;

    

    background: url("../images/home/award_img.jpg") no-repeat center top;

    background-size: cover;

}



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

    .award {

        display: block;

    }

    .award_text {

        display: block;

        width: 100%;

    }

    .award_img {

        display: block;

        width: 100%;

        height: 540px;

    }

}

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

    .award_img {

        height: 360px;

    }

}













/*****************************************************************************************************

スライドショー

******************************************************************************************************/

.slide-show {

	background-color: #F2F2F7;

    padding: 75px 15px;

}

.slide-show > div {

	max-width: 750px;

    margin: 0 auto;

}



.slide-show h2 {

	font-size: 150%;/*24*/

    text-align: center;

    margin-bottom: 1em;

}



/****************************************/

.bx-wrapper {

  -moz-box-shadow: none;

  -webkit-box-shadow: none;

  box-shadow: none;

  border: none;

  background: transparent;

}

.bx-wrapper .bx-controls-direction a {

  z-index: 8;

}

.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {

  width: 85%;

}

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

    .bx-wrapper .bx-pager {

      bottom: -55px;

    }

}

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

    .bx-wrapper .bx-pager {

      bottom: -80px;

    }

}











/*****************************************************************************************************

概要

******************************************************************************************************/

.summary {

    background-color: #FFF;

    padding: 50px 15px;

    text-align: center;

}

.summary > div {

    max-width: 1000px;

    margin: 0 auto;

}



.summary h2 {

    font-size: 150%;/*24*/

}

.summary h3 {

    font-size: 118.8%;/*19*/

}

.summary p {

    font-size: 100%;/*16*/

}

.summary p a.btn {

    font-size: 87.5%;/*14*/

}















/*****************************************************************************************************

Claris Engage とは

******************************************************************************************************/

.what-cej {

    background-color: #F2F2F7;

    padding: 60px 0;

}

.what-cej > div {

    max-width: 1030px;

    margin: 0 auto;

}

.what-cej > div > div {

    width: 50%;

    float: left;

    box-sizing: border-box;

    padding: 15px;

}

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

    .what-cej > div > div {

        width: 100%;

    }

}



.what-cej_l h2 {

    font-size: 150%;/*24*/

}

.what-cej_l p {

    font-size: 100%;/*16*/

}

.what-cej_r p {

    font-size: 87.5%;/*14*/

}



/* SNS ********************/

.what-cej .share {

    letter-spacing: -.4em;

    margin-top: 20px;

}

.what-cej .share a {

    letter-spacing: normal;

    display: inline-block;

    width: 20px;

    height: 20px;

}

.what-cej .share a.share_t {

    background: url("../images/common/icon_sns_gray_t_v2.png") no-repeat center center;

    background-size: 18px 18px;

}

.what-cej .share a.share_f {

    background: url("../images/common/icon_sns_gray_f.png") no-repeat center center;

    background-size: 20px 20px;

    margin-left: 20px;

}















/*****************************************************************************************************

あなたがこのような方でしたら、ぜひご参加ください。

******************************************************************************************************/

.recommend {

    background-color: #232A42;

    padding: 75px 0;

    text-align: center;

}



.recommend h2 {

    font-size: 150%;/*24*/

    color: #FFF;

    margin: 0 15px;

}



ul.recommend_list {

    max-width: 1030px;

    margin: 0 auto;

    letter-spacing: -.4em;

}

ul.recommend_list li {

    letter-spacing: normal;

    list-style: none;

    display: inline-block;

    vertical-align: top;

    width: 25%;

    box-sizing: border-box;

    padding: 50px 15px 0 15px;

}



ul.recommend_list h3 {

    font-weight: 300;

    font-size: 87.5%;/*14*/

    color: #FFF;

    margin: 1em 0;

}

ul.recommend_list a.btn {

    font-size: 75%;/*12*/

}



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

    ul.recommend_list li {

        width: 33.33%;

    }

}

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

    ul.recommend_list li {

        width: 50%;

    }

}















/*****************************************************************************************************

Claris Engage Japan 公式アカウント

******************************************************************************************************/

.official-account {

    background-color: #60C0DB;

    padding: 50px 15px;

    text-align: center;

}

.official-account > div {

    max-width: 1000px;

    margin: 0 auto;

}



.official-account h2 {

    font-size: 118.8%;/*19*/

}

.official-account p {

    font-size: 87.5%;/*14*/

    margin-top: 1em;

}

















/*****************************************************************************************************

セッションカテゴリ

******************************************************************************************************/

.category {

    background-color: #FFF;

    padding: 75px 0;

    text-align: center;

}



.category > div {

    max-width: 1030px;

    margin: 0 auto;

    box-sizing: border-box;

    padding: 0 15px;

}

.category > div > h2 {

    font-size: 150%;/*24*/

}

.category > div > p {

    font-size: 100%;/*16*/

    margin-top: 1em;

}



ul.category_list {

    max-width: 1030px;

    margin: 0 auto;

    letter-spacing: -.4em;

}

ul.category_list li {

    letter-spacing: normal;

    list-style: none;

    display: inline-block;

    vertical-align: top;

    width: 33.33%;

    box-sizing: border-box;

    padding: 50px 15px 0 15px;

}



ul.category_list h3 {

    font-size: 118.8%;/*19*/

    margin-top: 1em;

}

ul.category_list p {

    font-size: 87.5%;/*14*/

    margin: 1em 0;

}

ul.category_list a.btn {

    font-size: 87.5%;/*14*/

}

ul.category_list .btn_tech a.btn {

    font-size: 75%;/*12*/

    margin: 10px 2px 0 2px;

}



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

    ul.category_list li {

        width: 100%;

    }

}















/*****************************************************************************************************

CEJ2Go スケジューラー

******************************************************************************************************/

.cej2go {

    background-color: #2F9FBC;

    color: #FFF;

    padding: 35px 0;

    position: relative;

}

.cej2go a.anchor {

    position: absolute;

	top: -60px;

}

.cej2go > div {

    display: table;

    width: 100%;

    max-width: 1030px;

    margin: 0 auto;

}



.cej2go_l,

.cej2go_r {

    display: table-cell;

    vertical-align: middle;

    box-sizing: border-box;

    padding: 15px;

}

.cej2go_l {

    width: 30%;

}

.cej2go_r {

    width: 70%;

}



img.cej2go_img {

    width: 100%;

    max-width: 200px;

}



.cej2go h2 {

    font-size: 125%;/*20*/

}

.cej2go h2 br {

    display: none;

}



.cej2go p {

    font-size: 87.5%;/*14*/

}



.cej2go a {

    color: #FFF;

    text-decoration: underline;

}



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

    .cej2go_l,

    .cej2go_r {

        display: block;

        width: 100%;

        text-align: center;

    }

    img.cej2go_img {

        max-width: 150px;

    }

    .cej2go h2 br {

        display: inline;

    }

}















/*****************************************************************************************************

Claris Engage Japan - Annex

******************************************************************************************************/

.cej-annex {

    /*background-color: #FFE67B;*/

    background-color: #2C2C2E;

    padding: 50px 15px;

    text-align: center;

    color: #FFF;

}

.cej-annex > div {

    max-width: 1000px;

    margin: 0 auto;

}



.cej-annex h2 {

    font-size: 150%;/*24*/

}

.cej-annex p {

    font-size: 100%;/*16*/

    margin-top: 1em;

}

















/*****************************************************************************************************

スポンサー

******************************************************************************************************/

.sponsor {

	background-color: #FFF;

    padding: 75px 15px;

    position: relative;

}

.sponsor > div {

	max-width: 1000px;

	margin: 0 auto;

}



.sponsor a.anchor {

    position: absolute;

	top: -60px;

}



.sponsor h2 {

	font-size: 150%;/*24*/

}

.sponsor h3 {

	font-size: 118.8%;/*19*/

    margin-top: 50px;

}



.sponsor ul {

	letter-spacing: -.4em;

}

.sponsor ul li {

	letter-spacing: normal;

    display: inline-block;

	vertical-align: middle;

    text-align: center;

}



.sponsor ul.platinum li {

	width: 50%;

    padding: 50px 0;

}

.sponsor ul.gold li {

	width: 33.33%;

    padding: 40px 0;

}

.sponsor ul.silver li {

	width: 25%;

    padding: 30px 0;

}

.sponsor ul.bronze li {

    width: 25%;

    padding: 20px 0;

    font-size: 87.5%;/*14*/

    vertical-align: top;

}

.sponsor ul.bronze li a {

    color: #222;

}



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

    .sponsor ul.platinum li {

        width: 100%;

    }

    .sponsor ul.gold li {

        width: 50%;

    }

    .sponsor ul.silver li,

    .sponsor ul.bronze li {

        width: 33.33%;

    }

}

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

    .sponsor ul.gold li,

    .sponsor ul.silver li,

    .sponsor ul.bronze li {

        width: 100%;

    }

}



.sponsor .logo { width: 100%; }



.sponsor .logo.yeswecan        { max-width: 175px; }

.sponsor .logo.genecom         { max-width: 275px; }

.sponsor .logo.technicalunion  { max-width: 300px; }



.sponsor .logo.msis            { max-width: 200px; }

.sponsor .logo.kotobukishokai  { max-width: 250px; }

.sponsor .logo.startiaraise    { max-width: 225px; }

.sponsor .logo.nec             { max-width: 225px; }

.sponsor .logo.eventregist     { max-width: 200px; }



.sponsor .logo.itcrowd         { max-width: 175px; }

.sponsor .logo.supportas       { max-width: 175px; }

.sponsor .logo.splash          { max-width: 200px; }

.sponsor .logo.dbpowers        { max-width: 110px; }

.sponsor .logo.too             { max-width: 100px; }

.sponsor .logo.topofficesystem { max-width: 100px; }

.sponsor .logo.nishikawa       { max-width: 110px; }

.sponsor .logo.pattosystem     { max-width: 110px; }