@charset "utf-8";
/*****************************************************************************************************
汎用クラス
******************************************************************************************************/
span.session-id {
    display: inline-block;
    color: #FFF;
    padding: 0 5px;
}
a.session-title {
    text-decoration: underline;
}







/*****************************************************************************************************
イントロ
******************************************************************************************************/
.intro {
    background-image: linear-gradient(0deg, #2C2C2E 0%, #000 75%);
    color: #FFF;
    padding: 100px 15px;
    text-align: center;
}

.intro h2 {
    font-size: 150%;/*24*/
    display: inline-block;
    background: linear-gradient(90deg, #1DC598 5%, #4CAEF3 50%, #FF61BE 95%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.intro_symbol {
    font-size: 0;
    margin: 75px 0 25px 0;
}
.intro_symbol img {
    width: 50px;
}
img.intro_symbol_connect {
    margin: 0 50px;
}

@media screen and (max-width: 1100px) {
    .intro h2 br,
    .intro p br {
        display: none;
    }
}








/*****************************************************************************************************
Claris のお客様は以下のように DX を実現しています。
******************************************************************************************************/
.problem {
    background-image: linear-gradient(135deg, #C6F0E5 5%, #D2EBFC 50%, #FFD7EF 95%);
    padding: 75px 0;
}

/******************************/
.problem_head,
.problem_foot {
    box-sizing: border-box;
    padding: 0 15px;
    max-width: 1030px;
    margin: 0 auto;
    text-align: center;
}
.problem_head {
    padding-bottom: 40px;
}
.problem_foot {
    padding-top: 40px;
}

.problem_head h2 {
    font-size: 150%;/*24*/
    margin-bottom: 1em;
}

/******************************/
ul.problem_list {
    box-sizing: border-box;
    padding: 0 10px;
    max-width: 1500px;
    margin: 0 auto;
    text-align: center;
    letter-spacing: -.4em;
}
ul.problem_list li {
    letter-spacing: normal;
    display: inline-block;
    vertical-align: top;
    box-sizing: border-box;
    padding: 10px;
    width: 25%;
}
@media screen and (max-width: 1024px) {
    ul.problem_list li {
        width: 33.33%;
    }
}
@media screen and (max-width: 820px) {
    ul.problem_list li {
        width: 50%;
    }
}
@media screen and (max-width: 700px) {
    ul.problem_list li {
        width: 100%;
    }
}

.problem_list_card {
    background-color: #FFF;
    box-sizing: border-box;
    padding: 20px 15px;
}
.problem_list_card img {
    opacity: 0.5;
}
.problem_list_card h3 {
    margin-top: 1em;
}
.problem_list_card p {
    font-size: 87.5%;/*14*/
    margin: 1em 0;
}
.problem_list_card a.btn {
    font-weight: 600;
}









/*****************************************************************************************************
セッション リスト
******************************************************************************************************/
.session-list {
    padding: 75px 15px;
    text-align: center;
}
.session-list > div {
    max-width: 1000px;
    margin: 0 auto;
}

.session-list h3 {
    font-size: 150%;/*24*/
}
.session-list h3 img {
    margin-bottom: 10px;
    opacity: 0.5;
}

.session-list h4 {
    margin-top: 1.5em;
}
.session-list p {
    font-size: 87.5%;/*14*/
}

.session-list_btn {
    padding-top: 20px;
}
.session-list_btn a.btn {
    margin: 10px 5px 0 5px;
}









/*****************************************************************************************************
Claris カンファレンス 2025 に参加して、
業務改善やビジネス課題解決のヒントをお持ち帰りください！
******************************************************************************************************/
.participate {
    padding: 75px 15px;
}
.participate > div {
    max-width: 1000px;
    margin: 0 auto;
}

.participate h2 {
    font-size: 150%;/*24*/
    text-align: center;
    margin-bottom: 2em;
}
@media screen and (max-width: 700px) {
    .participate h2 br {
        display: none;
    }
}

.participate p {
    margin-top: 1em;
}

.participate b.highlight {
    font-size: 118.8%;/*19*/
}
.participate b.highlight a {
    color: #000;
    background: #FFE67B;
}
.participate b.highlight a:hover {
    background: #FFD426;
}









/*****************************************************************************************************
Claris FileMaker がはじめての方向けのセッション
******************************************************************************************************/
.product-intro {
    padding: 75px 15px;
    text-align: center;
}
.product-intro > div {
    max-width: 1000px;
    margin: 0 auto;
}

img.product-intro_logo {
    height: 50px;
    margin-bottom: 50px;
}
@media screen and (max-width: 700px) {
    img.product-intro_logo {
        height: auto;
        width: 80%;
    }
}

.product-intro h2 {
    font-size: 150%;/*24*/
}
.product-intro h3 {
    font-size: 118.8%;/*19*/
}









/*****************************************************************************************************
予習、できます。
******************************************************************************************************/
.prepare {
    background: #f2f2f7;
    padding: 75px 15px;
}
.prepare > div {
    max-width: 1000px;
    margin: 0 auto;
}

.prepare h2 {
    font-size: 200%;/*32*/
    text-align: center;
    margin-bottom: 1em;
}

.prepare h3 {
    font-size: 118.8%;/*19*/
    margin-top: 2em;
}
.prepare h3 a {
    color: #000;
    background: #4FE669;
}
.prepare h3 a:hover {
    background: #34C759;
}

.prepare p {
    margin-top: 1em;
}