@charset "utf-8";
/*****************************************************************************************************
リセット
******************************************************************************************************/
html {
    scroll-behavior: smooth;
    scroll-padding-top: 60px;
}
@media only screen and (max-width: 1068px) {
    html {
        scroll-padding-top: 48px;
    }
}

body,
h1,h2,h3,h4,h5,h6,
p,
ul,ol,li,
dl,dt,dd {
    margin: 0;
    padding: 0;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
img {
    vertical-align: middle;
}

/*****************************************************************************************************
フォント
******************************************************************************************************/
body {
    font-family: "SF Pro JP", "SF Pro Display", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    font-weight: 300;
    line-height: 1.5;
    overflow-wrap: break-word;
    -webkit-text-size-adjust: 100%;
}
h1,h2,h3,h4,h5,h6,strong,b {
    font-weight: 600;
    font-size: 100%;
}

/* claris.com *********************************/
body {
    font-size: 120%;
    line-height: 1.3;
}

/*****************************************************************************************************
リンク
******************************************************************************************************/
/* Dark Green */
a {
    text-decoration: none;
    color: #208A3D;
}
a:hover {
    color: #34C759;
}

/* Green */
a.green {
    color: #34C759;
}
a.green:hover {
    color: #208A3D;
}

/* Light Green */
a.l-green {
    color: #4FE669;
}
a.l-green:hover {
    color: #34C759;
}

/* Dark Yellow */
a.d-yellow {
    color: #A05A00;
}
a.d-yellow:hover {
    color: #B37B33;
}

/* Blue */
a.blue {
    color: #2F9FBC;
}
a.blue:hover {
    color: #186A80;
}

/* Dark Purple */
a.d-purple {
    color: #663E80;
}
a.d-purple:hover {
    color: #9D70BA;
}

/* Purple */
a.purple {
    color: #9D70BA;
}
a.purple:hover {
    color: #663E80;
}

/* Red */
a.red {
    color: #FF665A;
}
a.red:hover {
    color: #993831;
}

/*****************************************************************************************************
リンク（ボタン）
******************************************************************************************************/
a.btn {
    display: inline-block;
    box-sizing: border-box;
    border: solid 1px;
    border-radius: 3px;
    padding: 0.5em 1em;
    transition: color 0.25s, border-color 0.25s, background-color 0.25s;
}
a.btn:hover {
    transition: color 0.25s, border-color 0.25s, background-color 0.25s;
}

/* Dark Green */
a.btn.d-green {
    color: #208A3D;
    border-color: #208A3D;
    background-color: transparent;
}
a.btn.d-green:hover {
    color: #FFF;
    border-color: #208A3D;
    background-color: #208A3D;
}

/* Dark Green (Fill) */
a.btn.d-green-fill {
    color: #FFF;
    border-color: #208A3D;
    background-color: #208A3D;
}
a.btn.d-green-fill:hover {
    color: #FFF;
    border-color: #34C759;
    background-color: #34C759;
}

/* Green (Fill) */
a.btn.green-fill {
    color: #FFF;
    border-color: #34C759;
    background-color: #34C759;
}
a.btn.green-fill:hover {
    color: #FFF;
    border-color: #208A3D;
    background-color: #208A3D;
}

/* Light Green */
a.btn.l-green {
    color: #4FE669;
    border-color: #4FE669;
    background-color: transparent;
}
a.btn.l-green:hover {
    color: #FFF;
    border-color: #4FE669;
    background-color: #4FE669;
}

/* Dark Yellow */
a.btn.d-yellow {
    color: #A05A00;
    border-color: #A05A00;
    background-color: transparent;
}
a.btn.d-yellow:hover {
    color: #FFF;
    border-color: #A05A00;
    background-color: #A05A00;
}

/* Light Yellow */
a.btn.l-yellow {
    color: #FFE67B;
    border-color: #FFE67B;
    background-color: transparent;
}
a.btn.l-yellow:hover {
    color: #FFF;
    border-color: #FFE67B;
    background-color: #FFE67B;
}

/* Dark Blue */
a.btn.d-blue {
    color: #186A80;
    border-color: #186A80;
    background-color: transparent;
}
a.btn.d-blue:hover {
    color: #FFF;
    border-color: #186A80;
    background-color: #186A80;
}

/* Light Blue */
a.btn.l-blue {
    color: #60C0DB;
    border-color: #60C0DB;
    background-color: transparent;
}
a.btn.l-blue:hover {
    color: #FFF;
    border-color: #60C0DB;
    background-color: #60C0DB;
}

/* Dark Purple */
a.btn.d-purple {
    color: #663E80;
    border-color: #663E80;
    background-color: transparent;
}
a.btn.d-purple:hover {
    color: #FFF;
    border-color: #663E80;
    background-color: #663E80;
}

/* Dark Purple (Fill) */
a.btn.d-purple-fill {
    color: #FFF;
    border-color: #663E80;
    background-color: #663E80;
}
a.btn.d-purple-fill:hover {
    color: #FFF;
    border-color: #9D70BA;
    background-color: #9D70BA;
}

/* Purple (Fill) */
a.btn.purple-fill {
    color: #FFF;
    border-color: #9D70BA;
    background-color: #9D70BA;
}
a.btn.purple-fill:hover {
    color: #FFF;
    border-color: #663E80;
    background-color: #663E80;
}

/* Light Purple */
a.btn.l-purple {
    color: #CBA1E6;
    border-color: #CBA1E6;
    background-color: transparent;
}
a.btn.l-purple:hover {
    color: #FFF;
    border-color: #CBA1E6;
    background-color: #CBA1E6;
}

/* Dark Red */
a.btn.d-red {
    color: #993831;
    border-color: #993831;
    background-color: transparent;
}
a.btn.d-red:hover {
    color: #FFF;
    border-color: #993831;
    background-color: #993831;
}

/* Black */
a.btn.black {
    color: #000;
    border-color: #000;
    background-color: transparent;
}
a.btn.black:hover {
    color: #FFF;
    border-color: #000;
    background-color: #000;
}

/* Black (Fill) */
a.btn.black-fill {
    color: #FFF;
    border-color: #000;
    background-color: #000;
}
a.btn.black-fill:hover {
    color: #FFF;
    border-color: #48484A;
    background-color: #48484A;
}

/* White */
a.btn.white {
    color: #FFF;
    border-color: #FFF;
    background-color: transparent;
}
a.btn.white:hover {
    color: #000;
    border-color: #FFF;
    background-color: #FFF;
}

/* CC25 Green (Fill) */
a.btn.cc25-green-fill {
    color: #FFF;
    border-color: #1DC598;
    background-color: #1DC598;
}
a.btn.cc25-green-fill:hover {
    color: #FFF;
    border-color: #179E7A;
    background-color: #179E7A;
}

/* CC25 Blue (Fill) */
a.btn.cc25-blue-fill {
    color: #FFF;
    border-color: #4CAEF3;
    background-color: #4CAEF3;
}
a.btn.cc25-blue-fill:hover {
    color: #FFF;
    border-color: #3D8BC2;
    background-color: #3D8BC2;
}

/* CC25 Pink (Fill) */
a.btn.cc25-pink-fill {
    color: #FFF;
    border-color: #FF61BE;
    background-color: #FF61BE;
}
a.btn.cc25-pink-fill:hover {
    color: #FFF;
    border-color: #CC4E98;
    background-color: #CC4E98;
}

/* CC25 Dark Pink */
a.btn.cc25-d-pink {
    color: #CC4E98;
    border-color: #CC4E98;
    background-color: transparent;
}
a.btn.cc25-d-pink:hover {
    color: #FFF;
    border-color: #CC4E98;
    background-color: #CC4E98;
}

/*****************************************************************************************************
汎用クラス
******************************************************************************************************/
.clearfix:after {
    content: "";
    clear: both;
    display: block;
}
.secret{position:absolute;clip:rect(1px 1px 1px 1px);clip:rect(1px,1px,1px,1px);-webkit-clip-path:inset(0 0 99.9% 99.9%);clip-path:inset(0 0 99.9% 99.9%);overflow:hidden;height:1px;width:1px;padding:0;border:0}









/*****************************************************************************************************
Engageヘッダー PC
******************************************************************************************************/
.header_cej_pc {
    background-color: #000;
    width: 100%;
    position: fixed;
    top: 60px;
    z-index: 9;
}
.header_cej_pc.scrolled {
    top: 0;
}

.header_cej_pc > div {
    max-width: 1000px;
    height: 60px;
    margin: 0 auto;
    position: relative;
}

/* ホームリンク **********************/
a.header_cej_pc_home {
    height: 20px;
    line-height: 20px;
    position: absolute;
    top: 20px;
    left: 0;
    font-weight: 600;
    color: #FFF;
}
a.header_cej_pc_home:hover {
    opacity: 0.8;
}

/* リスト ***************************/
.header_cej_pc ul.nav {
    display: table;
    height: 60px;
    position: absolute;
    top: 0;
    right: 0;
}
.header_cej_pc ul.nav li {
    display: table-cell;
    vertical-align: middle;
    padding-left: 15px;
}

/* リンク ***************************/
.header_cej_pc ul.nav li a {
    display: inline-block;
    font-size: 87.5%;/*14*/
    color: #FFF;
}
.header_cej_pc ul.nav li a:hover {
    opacity: 0.8;
}

.header_cej_pc ul.nav li a.btn {
    font-size: 75%;/*12*/
}
.header_cej_pc ul.nav li a.btn:hover {
    opacity: 1;
}

/*****************************************************************************************************
Engageヘッダー SP
******************************************************************************************************/
.header_cej_sp {
    display: none;

    background-color: #000;
    width: 100%;
    height: 48px;

    position: fixed;
    top: 48px;
    z-index: 9;

    box-sizing: border-box;
    padding-top: 48px;
    overflow: hidden;

    transition: height 0.5s;
}
.header_cej_sp.scrolled {
    top: 0;
}
.header_cej_sp.opened {
    height: 100%;
    transition: height 0.5s;
}

/* ホームリンク **********************/
a.header_cej_sp_home {
    height: 20px;
    line-height: 20px;
    position: absolute;
    top: 14px;
    left: 15px;
    font-weight: 600;
    color: #FFF;
}

/* メニューボタン ********************/
.header_cej_sp_menu {
    width: 48px;
    height: 48px;
    position: absolute;
    top: 0;
    right: 0;
    background: url("../images/common/header_cej_menu_open.png") no-repeat center center;
    background-size: 17px 11px;
}
.header_cej_sp_menu.opened {
    background-image: url("../images/common/header_cej_menu_close.png");
}

/* リスト ***************************/
.header_cej_sp ul.nav {
    height: calc(100% - 48px);
    overflow: auto;
}
.header_cej_sp.scrolled ul.nav {
    height: 100%;
}
.header_cej_sp ul.nav li {
    list-style: none;
    font-size: 125%;/*20*/
    margin: 1em;
}

/* リンク ***************************/
.header_cej_sp ul.nav li a {
    color: #FFF;
}

/*****************************************************************
ナビの現在位置
******************************************************************/
body.page_timetable li.nav_timetable a,
body.page_session   li.nav_session   a,
body.page_speaker   li.nav_speaker   a,
body.page_showcase  li.nav_showcase  a,
body.page_workshop  li.nav_workshop  a {
    opacity: 0.6;
}

/*****************************************************************************************************
ヘッダーのスペース
******************************************************************************************************/
.header_space {
    height: 120px;
}

/*****************************************************************************************************
Engageヘッダー PC SP 切り替え
******************************************************************************************************/
@media only screen and (max-width: 1068px) {
    .header_cej_pc {
        display: none;
    }
    .header_cej_sp {
        display: block;
    }
    .header_space {
        height: 96px;
    }
}









/*****************************************************************************************************
Topに戻る
******************************************************************************************************/
a#top {
	position: absolute;
    top: 0;
}

a.back-to-top {
    position: fixed;
    right: 10px;
    bottom: -50px;
    z-index: 8;
    transition: bottom 0.5s;
}
a.back-to-top.scrolled {
	bottom: 20px;
	transition: bottom 0.5s;
}

a.back-to-top img {
    width: 40px;
}






