@charset "utf-8";

/* -------------------------------------------------------------------
#crosstalk-top
------------------------------------------------------------------- */

.sponly { display: none !important;}
body { margin: 0;font-family: 'Noto Sans JP', sans-serif; overflow-x: hidden;}
.breadcrumb {padding-top: 12px; padding-bottom: 12px; border-radius: 0; margin: 0; font-size: 14px;}
.breadcrumb {margin: 0 auto; padding-left: 20px; width: 100%; max-width: 940px;}
.breadcrumb li { display: inline-block; vertical-align: middle !important; color: #fff;}
.breadcrumb li+li:before { content: "> "; padding: 0 5px; color: #fff;}
.breadcrumb>.active { color: #fff;}
.breadcrumb a { color: #fff; font-weight: 500; text-decoration: none;}

#crosstalk-top { width: 100%; position: relative;}
#crosstalk-top .breadcrumb { position: absolute; top: 0; left: 0; z-index: 10;}
#crosstalk-top #mv { width: 100vw;  height: auto;}
#crosstalk-top #mv .mv_inner { position: relative; width: 100%;background: #268FCF;}
#crosstalk-top #mv .mv_inner img { width: 100%;}
#crosstalk-top #mv .mv_inner .scroll_down { position: absolute; bottom: 30px; left: 50%; transform: translateX(-50%); animation: scrolldown 1.3s; animation-iteration-count: infinite;}

/*ページ共通*/
#crosstalk-top h2 { font-size: 24px; font-weight: bold; letter-spacing: 0em; margin: 0; margin-bottom: 30px; text-align: center;}
#crosstalk-top #crosstalk-cont {}
#crosstalk-top #crosstalk-cont .crosstalk_inner { padding: 60px 0 130px; text-align: center;}
#crosstalk-top #crosstalk-cont .crosstalk_inner p.top-txt { font-size: 16px; line-height: 2.25em; text-align: center;}
#crosstalk-top #crosstalk-cont .crosstalk_inner .crosstalk_wrapper { display: flex; max-width: 1200px; margin: 60px auto 0; width: 87.8%; justify-content: space-between; text-align: right;}
#crosstalk-top #crosstalk-cont .crosstalk_inner .crosstalk_wrapper h2 { text-align: left; line-height: 1.75em; margin-bottom: 42px;}
#crosstalk-top #crosstalk-cont .crosstalk_inner .crosstalk_wrapper .crosstalk_left { width: 48.5%; max-width: 582px; }
#crosstalk-top #crosstalk-cont .crosstalk_inner .crosstalk_wrapper .crosstalk_right { width: 48.5%; max-width: 582px; }
#crosstalk-top #crosstalk-cont .crosstalk_inner .crosstalk_wrapper .crosstalk_left-img { width: 100%; margin-bottom: 30px;}
#crosstalk-top #crosstalk-cont .crosstalk_inner .crosstalk_wrapper .crosstalk_right-img { width: 100%; margin-bottom: 30px;}
#crosstalk-top #crosstalk-cont .crosstalk_inner .crosstalk_wrapper img { width: 100%;}
#crosstalk-top #crosstalk-cont .crosstalk_inner .crosstalk_wrapper a { position: relative; overflow: hidden; text-decoration: none; display: inline-block; border: 3px solid #000; text-align: center; outline: none; transition: ease .1s; background-color: #000; padding: 1.3em 8.03em; background-image: url(../../../img/crosstalk/btn_arrow_w.svg); background-repeat: no-repeat; background-size: 10px; background-position: right 10% top 50%; font-weight: bold; line-height: 1.5em;}
#crosstalk-top #crosstalk-cont .crosstalk_inner .crosstalk_wrapper a {}

#crosstalk-top .column_btn span { position: relative; z-index: 3; color:#fff; font-size: 16px;}
#crosstalk-top .column_btn:hover { color:#000; }
#crosstalk-top .column_btn:hover span{  color:#000; color: #000!important;}
#crosstalk-top .column_btn:before { content: '';  position: absolute; top: 0; left: 0; z-index: 2; background:#fff; width: 100%;  height: 100%; transition: transform .2s cubic-bezier(0.8, 0, 0.2, 1) 0s; transform: scale(0, 1); transform-origin: left top; color: #000;background-image: url("../../../img/crosstalk/btn_arrow_b.svg");background-repeat: no-repeat; background-size: 10px; background-position: right 10% top 50%;}
#crosstalk-top .column_btn:hover:before{  transform-origin:left top; transform:scale(1, 1);}