@charset "utf-8";

/* = ヘッダー
----------------------------------------------- */
.mod-header {
    position: fixed;
    z-index: 600;
    width: 100%;
    left: 0;
    top: 0;
}
.mod-headerLogo {
    width: 144px;
    position: absolute;
    top: 24px;
    left: 16px;
}
.mod-headerLogo img { display: block; }
.mod-headerShare {
    position: absolute;
    top: 16px;
    right: 16px;
}
.mod-headerShare:before {
    font-size: 1.2rem;
    font-weight: 700;
    line-height: 1;
    color: #ed6103;
    display: block;
    content: "SHARE";
    position: absolute;
    top: 0;
    right: 0;
}
.mod-headerShare ul {
    letter-spacing: -0.4em;
    margin-top: 16px;
}
.mod-headerShare li {
    font-size: 2.4rem;
    display: inline-block;
    letter-spacing: 0;
    vertical-align: top;
}
.mod-headerShare li:nth-child(n+2) { margin-left: 1em; }
.mod-headerShare a {
    color: #ed6103;
    -webkit-transition: color .3s ease;
    transition: color .3s ease;
}
.mod-headerShare a:hover { color: #8f8f8f; }

@media screen and (min-width:569px) {
.mod-headerLogo { left: 24px; }
.mod-headerShare { right: 24px; }
}

@media screen and (min-width:769px) {
.mod-headerLogo {
    width: 196px;
    top: 40px;
    left: 40px;
}
.mod-headerShare {
    top: 60px;
    right: 40px;
}
.mod-headerShare:before {
    font-size: 12px;
    top: 50%;
    right: auto;
    left: -70px;
    transform: translateY(-50%);
}
.mod-headerShare ul { margin-top: 0; }
}


/* = フッター
----------------------------------------------- */
.mod-footer {
    background: #fff;
    padding: 60px 48px;
}
.mod-footerLink {
    font-size: 1.4rem;
    color: #ed6103;
}
.mod-footerLink a {
    color: #ed6103;
    -webkit-transition: color .3s ease;
    transition: color .3s ease;
}
.mod-footerLogo {
    font-size: 0;
    margin-top: 45px;
}
.mod-footerLogo img { width: 132px; }
.mod-footerCopyright {
    font-size: 1.4rem;
    color: #ed6103;
    margin-top: 2em;
}

@media screen and (max-width:768px) {
.mod-footerLink li:nth-child(n+2) { margin-top: 1em; }
.mod-footerLink li .mail {
    display: block;
    margin-top: 1em;
}
}

@media screen and (min-width:769px) {
.mod-footer {
    text-align: center;
    padding: 40px 40px;
    position: relative;
}
.mod-footerLink { font-size: 14px; }
.mod-footerCopyright { font-size: 14px; }
}

@media screen and (min-width:1024px) {
.mod-footerLink { letter-spacing: -0.4em; }
.mod-footerLink li {
    line-height: 1;
    display: inline-block;
    letter-spacing: 0;
    vertical-align: top;
}
.mod-footerLink li:nth-child(n+2) { margin-left: 88px; }
.mod-footerLogo {
    margin: 0;
    position: absolute;
    top: 50%;
    left: 40px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}
.mod-footerCopyright {
    margin: 0;
    position: absolute;
    top: 50%;
    right: 40px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}
}


/* = コンテンツ
----------------------------------------------- */
#contents { overflow: hidden; }


/* = 申し込みボタン
----------------------------------------------- */
.ui-btn-application {
    font-size: 2.0rem;
    font-weight: 700;
    line-height: 64px;
    text-align: center;
    margin-top: 48px;
}
.ui-btn-application a {
    color: #fff;
    background: #ed6103;
    display: block;
    max-width: 280px;
    margin: 0 auto;
    border: solid 2px #ed6103;
    border-radius: 34px;
    -webkit-transition: color .3s ease, background .3s ease;
    transition: color .3s ease, background .3s ease;
}

@media screen and (min-width:769px) {
.ui-btn-application {
    font-size: 20px;
    margin-top: 40px;
}
}


/* = 表示
----------------------------------------------- */
@media screen and (max-width:768px) {
.mod-isPc { display: none !important; }
}

@media screen and (min-width:769px) {
.mod-isSp { display: none !important; }
}


/* = リンク
----------------------------------------------- */
.ui-line {
    line-height: 1;
    display: inline-block;
    padding-bottom: 4px;
    position: relative;
}
.ui-line .icon-external {
    display: block;
    vertical-align: top;
    position: absolute;
    top: 2px;
    right: -16px;
}

@media screen and (min-width:769px) {
.ui-line:after {
    background: #ed6103;
    display: block;
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    left: 0;
    bottom: -2px;
    -webkit-transform-origin: right top;
    transform-origin: right top;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition: -webkit-transform .6s cubic-bezier(.075, .82, .165, 1);
    transition: transform .6s cubic-bezier(.075, .82, .165, 1);
}
.ui-line:hover:after {
    -webkit-transform-origin: left top;
    transform-origin: left top;
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
}
.ui-line .icon-external {
    -webkit-transition: -webkit-transform .6s cubic-bezier(.075, .82, .165, 1);
    transition: transform .6s cubic-bezier(.075, .82, .165, 1);
}
.ui-line:hover .icon-external {
    -webkit-transform: translate(50%, -50%);
    transform: translate(50%, -50%);
}
}


/* = タイトル
----------------------------------------------- */
.mod-sectionTitle {
    font-size: 3.2rem;
    font-weight: 900;
    color: #ed6103;
    letter-spacing: .08em;
    text-align: center;
}
.mod-sectionTitle.about { text-align: left; }

@media screen and (min-width:769px) {
.mod-sectionTitle { font-size: 40px; }
}


/* = キービジュアル
----------------------------------------------- */
.sec-keyvisual {
    text-align: center;
    height: 640px;
    position: relative;
}
.mod-keyvisualLogo {
    max-width: 327px;
    width: 87.2%;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -33%);
    transform: translate(-50%, -33%);
}
.mod-keyvisualLogo .logo img { width: 100%; }
.mod-keyvisualLogo .ui-btn-application { margin-top: 47px; }

@media screen and (min-width:569px) {
.sec-keyvisual { height: 100.9102730819246vw; }
.mod-keyvisualLogo {
    max-width: 584px;
    width: 75.94278283485046%;
    -webkit-transform: translate(-50%, -39%);
    transform: translate(-50%, -39%);
}
}

@media screen and (max-width:768px) {
.sec-keyvisual {
    background: url(/img/event/session2019/kv_sp.jpg) no-repeat center center;
    background-size: 100% auto;
}
}

@media screen and (min-width:769px) {
.sec-keyvisual { height: 776px; }
.sec-keyvisual {
    background: url(/img/event/session2019/kv.jpg) no-repeat center bottom;
    background-size: auto 720px;
}
.mod-keyvisualLogo {
    width: 584px;
    -webkit-transform: translate(-50%, -37.5%);
    transform: translate(-50%, -37.5%);
}
.mod-keyvisualLogo .ui-btn-application { margin-top: 56px; }
}


/* = ABOUT
----------------------------------------------- */
.sec-about { margin-top: 24px; }
.sec-about .aboutInner { padding: 0 16px; }
.mod-aboutBox { position: relative; }
.mod-aboutBox:before,
.mod-aboutBox:after,
.mod-aboutBox .aboutBoxInner:before,
.mod-aboutBox .aboutBoxInner:after {
    background: url(/img/event/session2019/corner.png) no-repeat center center;
    background-size: 100% auto;
    display: block;
    content: "";
    width: 26px;
    height: 20px;
    position: absolute;
}
.mod-aboutBox:before {
    top: 0;
    left: 0;
}
.mod-aboutBox:after {
    top: 0;
    right: 0;
    -webkit-transform-origin: right top;
    transform-origin: right top;
    -webkit-transform: rotate(90deg) translateX(100%);
    transform: rotate(90deg) translateX(100%);
}
.mod-aboutBox .aboutBoxInner:before {
    left: 0;
    bottom: 0;
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(-90deg) translateY(100%);
    transform: rotate(-90deg) translateY(100%);
}
.mod-aboutBox .aboutBoxInner:after {
    right: 0;
    bottom: 0;
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(180deg) translate(100%, 100%);
    transform: rotate(180deg) translate(100%, 100%);
}
.mod-aboutBox .aboutBoxInner { padding: 58px 32px 72px; }
.mod-aboutBox .aboutBoxText .message {
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 2.222222222222222;
    margin-top: 40px;
}
.mod-aboutBox .aboutBoxText .message p:nth-child(n+2) { margin-top: 1.5em; }

@media screen and (min-width:569px) {
.sec-about { margin-top: 134px; }
.sec-about .aboutInner { padding: 0 24px; }
.mod-aboutBox:before,
.mod-aboutBox:after,
.mod-aboutBox .aboutBoxInner:before,
.mod-aboutBox .aboutBoxInner:after {
    width: 40px;
    height: 32px;
}
.mod-aboutBox .aboutBoxInner { padding: 70px 32px 86px; }
.mod-aboutBox .aboutBoxText .message { font-size: 2.0rem; }
}

@media screen and (min-width:769px) {
.sec-about { padding: 0 40px; }
.sec-about .aboutInner {
    max-width: 1032px;
    margin: 0 auto;
    padding: 0;
}
.mod-aboutBox .aboutBoxText { letter-spacing: -0.4em; }
.mod-aboutBox .aboutBoxText > * {
    display: inline-block;
    letter-spacing: 0;
    vertical-align: top;
    width: 50%;
}
.mod-aboutBox .aboutBoxText .message {
    font-size: 18px;
    margin-top: 0;
}
}

@media screen and (min-width:1024px) {
.sec-about { padding: 0 40px; }
.mod-aboutBox .aboutBoxInner { padding: 80px; }
.mod-aboutBox .aboutBoxText .message { font-size: 20px; }
}


/* = TIME TABLE
----------------------------------------------- */
.sec-timetable { margin-top: 80px; }
.sec-timetable .timetableInner { padding: 0 16px; }
.mod-timetableList { margin-top: 45px; }
.mod-timetableList .timetableItem {
    font-size: 1.5rem;
    font-weight: 700;
    display: table;
    width: 100%;
    table-layout: fixed;
}
.mod-timetableList .timetableItem:nth-child(n+2) { margin-top: 40px; }
.mod-timetableList .timetableItem > * {
    display: table-cell;
    vertical-align: top;
}
.mod-timetableList .time {
    color: #ed6103;
    width: 8.5em;
}
.mod-timetableList .title {
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.6;
}
.mod-timetableSpeaker { margin-top: 16px; }
.mod-timetableSpeaker li {
    letter-spacing: -0.4em;
    white-space: nowrap;
}
.mod-timetableSpeaker li:nth-child(n+2) { margin-top: 16px; }
.mod-timetableSpeaker li > * {
    display: inline-block;
    letter-spacing: 0;
    vertical-align: middle;
}
.mod-timetableSpeaker .photo { width: 64px; }
.mod-timetableSpeaker .text { margin-left: 7.729468599033816%; }
.mod-timetableSpeaker .belongs {
    font-size: 1.1rem;
    font-weight: 500;
    color: #ed6103;
}
.mod-timetableSpeaker .name {
    font-size: 1.5rem;
    font-weight: 700;
}

@media screen and (min-width:375px) {
.mod-timetableList .timetableItem { font-size: 1.6rem; }
.mod-timetableSpeaker .belongs { font-size: 1.2rem; }
.mod-timetableSpeaker .name { font-size: 1.6rem; }
.mod-timetableSpeaker .text { margin-left: 16px; }
}

@media screen and (min-width:569px) {
.sec-timetable { margin-top: 216px; }
.sec-timetable .timetableInner { padding: 0 24px; }
.mod-timetableList { margin-top: 70px; }
.mod-timetableList .timetableItem { font-size: 2.0rem; }
.mod-timetableList .timetableItem:nth-child(n+2) {
    margin-top: 32px;
    padding-top: 32px;
    border-top: solid 1px #f4f4f4;
}
.mod-timetableList .timetableItem .title { font-size: 2.0rem; }
.mod-timetableSpeaker .photo { width: 160px; }
.mod-timetableSpeaker .belongs { font-size: 1.4rem; }
.mod-timetableSpeaker .name { font-size: 1.8rem; }
}

@media screen and (min-width:769px) {
.sec-timetable { padding: 0 40px; }
.sec-timetable .timetableInner {
    max-width: 880px;
    margin: 0 auto;
    padding: 0;
}
.mod-timetableList .timetableItem { font-size: 20px; }
.mod-timetableList .time { width: 256px; }
.mod-timetableList .title { font-size: 20px; }
.mod-timetableSpeaker {
    letter-spacing: -0.4em;
    margin-top: 40px;
}
.mod-timetableSpeaker li {
    display: inline-block;
    letter-spacing: 0;
    vertical-align: top;
    width: 25.64102564102564%;
}
.mod-timetableSpeaker li:nth-child(n+2) { margin: 0 0 0 7.692307692307692%; }
.mod-timetableSpeaker li > * { display: block; }
.mod-timetableSpeaker .photo { width: 100%; }
.mod-timetableSpeaker .text {
    text-align: center;
    margin: 20px 0 0;
}
.mod-timetableSpeaker .belongs { font-size: 14px; }
.mod-timetableSpeaker .name {
    font-size: 18px;
    margin-top: .25em;
}
}


/* = SPEAKER
----------------------------------------------- */
.sec-speaker { margin-top: 80px; }
.sec-speaker .speakerInner { padding: 0 40px; }
.mod-speakers { margin-top: 48px; }
.mod-speakerItem:nth-child(n+2) { margin-top: 55px; }
.mod-speakerItem .itemInfo {
    letter-spacing: -0.4em;
    white-space: nowrap;
}
.mod-speakerItem .itemInfo > * {
    display: inline-block;
    letter-spacing: 0;
    vertical-align: middle;
}
.mod-speakerItem .belongs {
    font-size: 1.2rem;
    font-weight: 500;
    color: #ed6103;
}
.mod-speakerItem .name {
    font-size: 2.0rem;
    font-weight: 700;
    margin-top: .2em;
}
.mod-speakerItem .job {
    font-size: 1.2rem;
    font-weight: 700;
    color: #8f8f8f;
}
.mod-speakerItem .itemProfile {
    font-size: 1.3rem;
    margin-top: 24px;
}
.mod-speakerItem .itemLink { margin-top: 1em; }
.mod-speakerItem .links { font-size: 1.3rem; }
.mod-speakerItem .links li:nth-child(n+2) { margin-top: .5em; }
.mod-speakerItem .links a {
    text-decoration: underline;
    -webkit-transition: color .3s ease;
    transition: color .3s ease;
}
.mod-speakerItem .social {
    letter-spacing: -0.4em;
    margin-top: 1em;
}
.mod-speakerItem .social li {
    font-size: 3.0rem;
    display: inline-block;
    letter-spacing: 0;
    vertical-align: top;
}
.mod-speakerItem .social li:nth-child(n+2) { margin-left: 24px; }
.mod-speakerItem .social li a {
    -webkit-transition: color .3s ease;
    transition: color .3s ease;
}

/* moderator */
.mod-speakerItem.moderator {
    margin-top: 56px;
    padding-top: 32px;
    border-top: solid 1px #d2d2d2;
}
.mod-speakerItem.moderator .itemTitle {
    font-size: 1.8rem;
    font-weight: 700;
    text-align: center;
}
.mod-speakerItem.moderator .itemInfo { margin-top: 32px; }
.mod-speakerItem.moderator .photo { width: 80px; }
.mod-speakerItem.moderator .name { font-size: 1.6rem; }

@media screen and (max-width:568px) {
.mod-speakerItem .photo {
    max-width: 120px;
    width: 40.67796610169492%;
}
.mod-speakerItem .text { margin-left: 8.135593220338983%; }

}

@media screen and (min-width:569px) {
.sec-speaker { margin-top: 120px; }
.mod-speakerItem .photo { width: 160px; }
.mod-speakerItem .text { margin-left: 24px; }

/* moderator */
.mod-speakerItem.moderator .photo { width: 106px; }
}

@media screen and (min-width:769px) {
.sec-speaker { padding: 0 40px; }
.sec-speaker .speakerInner {
    max-width: 1032px;
    margin: 0 auto;
    padding: 0;
}
.mod-speakers { letter-spacing: -0.4em; }
.mod-speakerItem {
    box-sizing: border-box;
    display: inline-block;
    letter-spacing: 0;
    vertical-align: top;
    width: 46.89922480620155%;
    position: relative;
}
.mod-speakerItem:nth-child(n+2) { margin-top: 0; }
.mod-speakerItem:nth-child(even) { margin-left: 6.2015503875969%; }
.mod-speakerItem:nth-child(n+3) { margin-top: 50px; }
.mod-speakerItem .photo { width: 100px; }
.mod-speakerItem .belongs { font-size: 13px; }
.mod-speakerItem .name { font-size: 18px; }
.mod-speakerItem .job { font-size: 12px; }
.mod-speakerItem .itemProfile {
    font-size: 13px;
    margin-top: 15px;
}
.mod-speakerItem .itemLink { margin-top: 20px; }
.mod-speakerItem .links { font-size: 13px; }
.mod-speakerItem .social li { font-size: 20px; }
.mod-speakerItem .social li:nth-child(n+2) { margin-left: 15px; }

/* moderator */
.mod-speakerItem.moderator {
    display: table;
    table-layout: fixed;
    width: 100%;
    margin-top: 80px;
    padding-top: 40px;
}
.mod-speakerItem.moderator > * {
    display: table-cell;
    vertical-align: top;
}
.mod-speakerItem.moderator .itemTitle {
    font-size: 20px;
    text-align: left;
    letter-spacing: .08em;
    width: 207px;
}
.mod-speakerItem.moderator .photo { width: 80px; }
.mod-speakerItem.moderator .itemInfo {
    width: 238px;
    margin-top: 0;
}
.mod-speakerItem.moderator .name { font-size: 18px; }
.mod-speakerItem.moderator .itemProfile {
    font-size: 12px;
    margin-top: 0;
}
}

@media screen and (min-width:1024px) {
.mod-speakerItem:not(.moderator) { padding-left: 160px; }
.mod-speakerItem:not(.moderator) .photo {
    position: absolute;
    top: 0;
    left: 0;
}
.mod-speakerItem:not(.moderator) .text { margin-left: 0; }
.mod-speakerItem:not(.moderator) .job br { display: none; }

/* moderator */
.mod-speakerItem.moderator .itemTitle { width: 230px; }
.mod-speakerItem.moderator .itemInfo { width: 264px; }
}


/* = ACCESS
----------------------------------------------- */
.sec-access { margin-top: 80px; }
.mod-accessMap .accessInfo {
    font-size: 1.4rem;
    background: #fff;
    margin-top: 16px;
    padding: 32px 28px;
}
.mod-accessMap .accessInfo .logo { width: 220px; }
.mod-accessMap .accessInfo .logo img { width: 100%; }
.mod-accessMap .accessInfo .address {
    font-weight: 700;
    margin-top: 2em;
}
.mod-accessMap .accessInfo .link {
    letter-spacing: .02em;
    margin-top: .2em;
}
.mod-accessMap .accessInfo .link a { color: #ed6103; }
.mod-accessMap .accessInfo .link .icon-external {
 font-size: .8rem; margin-left: 1em; }
.mod-accessMap .accessInfo .route {
    font-weight: 700;
    margin-top: 20px;
}
.mod-accessMap .accessInfo .image { margin-top: 35px; }
.mod-accessMap .accessInfo .image img { width: 100%; }
.mod-accessMap .accessMap {
    height: 70vw;
    position: relative;
}
.mod-accessMap .accessMap iframe {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

@media screen and (min-width:569px) {
.sec-access { margin-top: 110px; }
.mod-accessMap .accessInfo { margin-top: 32px; }
.mod-accessMap .accessMap { height: 560px; }
}

@media screen and (min-width:769px) {
.mod-accessMap {
    position: relative;
    margin-top: 64px;
    padding-left: 280px;
}
.mod-accessMap .accessInfo {
    font-size: 13px;
    margin: 0;
    padding: 20px;
    z-index: 100;
    position: absolute;
    top: 0;
    left: 0;
}
.mod-accessMap .accessInfo .route { margin-top: 0; }
.mod-accessMap .accessInfo .link { margin-top: 32px; }
.mod-accessMap .accessInfo .image {
    width: 240px;
    margin-top: 30px;
}
}

@media screen and (min-width:1024px) {
.mod-accessMap { padding-left: 480px; }
.mod-accessMap .accessInfo {
    font-size: 14px;
    padding: 40px 80px;
}
.mod-accessMap .accessInfo .image { width: 320px; }
}


/* = DATE
----------------------------------------------- */
.sec-date { text-align: center; }
.mod-dateText { padding: 80px 16px; }
.mod-dateText .day {
    font-size: 2.4rem;
    font-weight: 700;
    margin-top: 1em;
}
.mod-dateText .week { font-size: 1.6rem; }
.mod-dateText .open {
    font-size: 1.4rem;
    font-weight: 700;
    margin-top: .5em;
}

@media screen and (min-width:569px) {
.sec-date { padding: 120px 40px; }
.mod-dateText { padding: 0; }
.mod-dateText .day { font-size: 4.0rem; }
.mod-dateText .week { font-size: 2.4rem; }
.mod-dateText .open {
    font-size: 2.4rem;
    margin-top: 1em;
}
}

@media screen and (min-width:769px) {
.mod-dateText .day { font-size: 40px; }
.mod-dateText .week { font-size: 24px; }
.mod-dateText .open { font-size: 24px; }
}


/* = WHO WE ARE
----------------------------------------------- */
.sec-who {
    background: #f4f4f4;
    text-align: center;
}
.mod-whoText { padding: 80px 24px 64px; }
.mod-whoText .title {
    font-size: 1.8rem;
    font-weight: 700;
    letter-spacing: .08em;
    color: #8f8f8f;
}
.mod-whoText .logo img { width: 250px; }
.mod-whoText .explanation {
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 1.571428571428571;
    letter-spacing: .04em;
    margin-top: 32px;
}
.mod-whoText .link {
    font-size: 1.8rem;
    font-weight: 700;
    letter-spacing: .08em;
    margin-top: 48px;
}
.mod-whoText .link a { color: #ed6103; }
.mod-whoText .link .icon-external {
    font-size: .4em;
    margin-left: 1em;
}

@media screen and (min-width:569px) {
.sec-who { padding: 80px 24px 64px; }
.mod-whoText { padding: 0; }
.mod-whoText .logo img { width: 358px; }
.mod-whoText .explanation {
    font-size: 1.6rem;
    line-height: 2;
    letter-spacing: .08em;
}
.mod-whoText .link { margin-top: 48px; }
}

@media screen and (min-width:769px) {
.sec-who { padding: 120px 40px 80px; }
.mod-whoText .title { font-size: 18px; }
.mod-whoText .explanation {
    font-size: 16px;
    margin-top: 48px;
}
.mod-whoText .link { font-size: 18px; }
}