/*
Theme Name:りんくうマラソン大会
*/

/*リンクテキスト設定*/
html{ font-size: 62.5%;}
html,body{
width: 100%;
}
body{ line-height: 1.5; font-family:"メイリオ", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", sans-serif; color: #666666;}
a{ text-decoration: none; transition: 0.5s ;color: #000000;}
a:visited{ color: #000000;}
a:hover img{ opacity: 0.8; transition: 0.5s ;}
a:hover,li:hover,input:hover,p:hover { transition: 0.5s ;}
figure{ margin:0}

/*フェードイン*/
.effect-fade {
opacity : 0;
transform : translate(0, 0);
transition : all 4000ms;
}

.effect-fade.effect-scroll {
opacity : 1;
transform : translate(0, 0);
}

/*シャドウ*/
.shadow    {
box-shadow: 1px 1px 5px #999;
-webkit-box-shadow: 1px 1px 5px #999;
-moz-box-shadow: 1px 1px 5px #999;
}
.txshadow{ text-shadow: 1px 1px 5px rgba(39, 51, 135, .90);}

/*縦書き*/
.tategaki {
-webkit-writing-mode: vertical-rl;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
font-feature-settings:normal;
}
/*明朝体*/
.min{font-family:'Noto Serif JP', 'Noto Serif Japanese', "游明朝", YuMincho, 'Noto Serif JP', serif, sans-serif;font-display: swap;}
/*ゴシック体*/
.gos{font-family:"Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;}
.impact{font-family:Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif}
.abel{font-family: 'Abel', sans-serif; }
.ropa{font-family: 'Ropa Sans', sans-serif;}

@font-face {
  font-family: 'Noto Sans CJK JP';
  font-style: normal;
  font-weight: 500;
  src: url('fonts/NotoSansJP-Medium.woff') format('woff');
  font-display: swap;
}
.notosan{font-family:"Noto Sans CJK JP"}
.roboto{font-family: 'Roboto', sans-serif;}




/*拡大画像調整*/
img.object-fit-img{ object-fit: cover; object-position: center; font-family: 'object-fit: cover; object-position: center;'}

/*ページネーション*/
.pagenation {
margin: 1em auto;
clear:both;
padding:0 0 50px 0;
width:100%;
}
.pagenation:after, .pagenation ul:after {
}
.pagenation ul {
margin: 0;
text-align:center;
}
.pagenation li {
list-style: none outside none;
margin-left: 3px;
display:inline-block;
}
.pagenation li:first-child {
margin-left: 0;
}
.pagenation li.active {
background-color: #999999;
border-radius: 3px;
color: #FFFFFF;
cursor: not-allowed;
padding: 10px 20px;
}
.pagenation li a {
background: none repeat scroll 0 0 #CCCCCC;
border-radius: 3px;
color: #FFFFFF;
display: block;
padding: 10px 20px;
text-decoration: none;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
}
.pagenation li a:hover {
background-color: #000000;
color: #FFFFFF;
opacity: 0.8;
transition-duration: 500ms;
transition-property: all;
transition-timing-function: ease;
}
.navigation.pagination{ display:none;}



/*拡大アニメーション*/
.zoom-1 img {
  width: 100%;
  height: auto;
  animation: animationZoom1 40s ease-in-out infinite;
}
.zoom {
  width: 300px;
  height: 200px;
  overflow: hidden;
  margin-bottom: 30px
}

@keyframes animationZoom1 {
  50% { transform:scale(1.1)} 
}









/*非表示*/
.nodisplay{ display: none;}

/**
* 最大幅の指定と中央寄せ
*/
.container {
position: relative;
margin-left: auto;
margin-right: auto;
max-width: 970px;
}

/**
* slick.js
*/
.slide-arrow{ position: absolute; top:0; bottom:0; margin:auto; z-index: 5;}
.prev-arrow{ left:5%}
.next-arrow{ right:5%}


@media (min-width: 970px) {
.swiper-button-prev,
.swiper-button-next {
width: 27px;
margin-top: -22px;
}
}
/**
* mainvisual
*/
.mainvisual {
overflow-x: hidden;
/*    overflow-y: hidden;*/
padding-bottom: 55px;

}
.wf-sawarabimincho { font-family: "Sawarabi Mincho"; }


/*装飾*/
.std{ font-size:1.8rem; font-weight: bold; text-align: center;}
.std small{ font-size:3.6rem; font-weight: bold; display: block; color: #fbb03b;}
.std i{font-weight: bold; display: flex; justify-content: center; align-items: center;}
.std i:before,
.std i:after{content: ''; width:5.0rem; height: 1px; display: block; background-color: #666666;}

/*固定ボタン*/

/*BASE*/
header{ width:95%; max-width:1100px; height:7.0rem; margin:0 auto; display: flex; justify-content: space-between; align-items: center;}
header .logo{ width:24.0rem;}
header .logo img{ width:100%; display: block;}
header .navigation ul{ display: flex; justify-content: flex-end; align-items: center;}
header .navigation li a{ font-size:1.6rem; font-weight: bold; display: block; padding:0 1.5rem}
header .navigation li:last-child a{ padding-right:0}
footer{ position: relative; display: flex; align-items: center; justify-content: center;}
footer::before{content:'';width:100%; height:100%; background-color: #fbb03b; position: absolute; clip-path: polygon(0 15%,100% 0, 100% 100%, 0 100%); z-index: 1;}
footer::after{content:'';width:100%; height:100%; background-color: #f7931e; position: absolute; clip-path: polygon(0 15%,100% 7.5%, 100% 100%, 0 100%); z-index: 2;}
footer .data{background-color: #000000; padding:5.0rem 0; color: #ffffff; display: flex; justify-content: center; align-items: center; clip-path: polygon(0 0,100% 15%,100% 100%, 0 100%); position: relative; z-index: 3; width:100%}
footer dl{ line-height: 1.8;}
footer dt{ font-size:2.0rem; font-weight: bold;}
footer dd{ font-size:1.6rem;}
footer dd i{ margin-right:0.5rem}

/*CONTENTS*/
.eyecatch{ display: flex; justify-content:flex-start; align-items: center; position: relative;}
.eyecatch:before{ content:''; display: block; width:100%; height:100%; background-color:#fbb03b; position: absolute; clip-path: polygon(0 0, 100% 5%, 100% 100%, 0 95%); z-index: 1;}
.eyecatch::after{ content:''; display: block; width:100%; height:100%; background-color:#f7931e; position: absolute; clip-path: polygon(0 2.5%, 100% 0, 100% 97.5%, 0 100%); z-index: 0;}
.eyecatch figure{ width:100%; clip-path: polygon(0 0, 100% 7.5%, 100% 100%, 0 92.5%); position: relative; z-index: 3;}
.eyecatch figure img{ width:100%; display: block; height:80vh; object-fit: cover; object-position: center;}
.eyecatch .text{ width:95%; max-width:1100px; min-height:100%; position: absolute; left:0; right:0; margin:0 auto; display: flex; align-items: center; z-index: 4; }
.eyecatch .text .wrap{ padding:2.5rem; background-color: rgba(255, 255, 255, 0.9);}
.eyecatch .text h1{ font-size:4.2rem; font-weight: bold; color: #000000;}
.eyecatch .text table { font-size:1.8rem; color: #000000;}
.eyecatch .text table th{ padding:0.5rem; font-weight: bold;}
.eyecatch .text table td{ padding:0.5rem}
.eyecatch .dlbutton{ display: flex; justify-content: center;}
.eyecatch .dlbutton a{ display: flex; padding:1.5rem; font-size: 1.6rem; color: #ffffff; background-color: #fbb03b; border-radius:1.0rem; justify-content: center; align-items: center; margin:1.5rem}
.eyecatch .dlbutton a:hover{ background-color: #000000;}
.information{ width:90%; max-width:900px; margin:0 auto; padding:7.5rem 0}
.information .block{ display:flex;}
.information figure{ margin-right:2.5rem;}
.information figcaption{ white-space: nowrap;}
.information ul{ width:calc(100% - 10.0rem)}
.information li{ display: flex; padding:1.5rem; justify-content: space-between; align-items: center; border-bottom: 1px dotted #666666;}
.information .text{ font-size:1.6rem;}
.information .text a{ font-size:1.8rem; font-weight: bold;}
.information .text .date{ white-space: nowrap; margin-right:0.5rem; display: block;}
.information li img{ max-width:12.0rem; height:100%; display: block; aspect-ratio: 3 / 2; object-fit: cover; border:1px solid #cccccc}
.information .button{ text-align: right; padding:1.5rem 0}
.information .button a{ font-size:1.6rem; display: flex; align-items: center; font-weight: bold; justify-content: flex-end;}
.information .button a:after{ content:''; display: block; width:1.4rem; height:1.6rem; background-color: #fbb03b; clip-path: polygon(0 0,100% 50%,0 100%); margin-left: 0.5rem;}
.information .ec{max-width:20.0rem;width:100%; height:auto; display: block;}
.raceoutline{ padding-bottom:10.0rem}
.raceoutline h2{ margin-bottom:5.0rem;}
.raceoutline .data{width:95%; max-width: 900px; margin:0 auto; margin-bottom:7.5rem}
.raceoutline .data table{ font-size:1.6rem; width:100%; line-height: 1.8;}
.raceoutline .data th{ padding:2.5rem; background-color: #fbb03b; color: #ffffff; white-space: nowrap; border:1px solid #cccccc; font-weight: bold;}
.raceoutline .data td{ padding:2.5rem; border:1px solid #cccccc}
.raceoutline .data td strong{ font-weight: bold; font-size: 2.0rem;}
.raceoutline .data td strong a{ font-weight: bold; font-size: 2.0rem; margin:0 0.5rem}
.raceoutline .sonota li{ display: flex;}
.raceoutline .sonota li::before{ content:'●'; display: block; color: #fbb03b; margin-right: 0.5rem;}
.raceoutline .kaihei li{ display: flex;}
.raceoutline .type{width:95%; max-width: 900px; margin:0 auto; margin-bottom:2.5rem;}
.raceoutline .type h3{ font-size:2.4rem; font-weight: bold; text-align: center; margin-bottom:2.5rem;}
.raceoutline .type h3:after{ content: ''; display: block; width:8.0rem; height: 0.5rem; background-color: #fbb03b; margin:0 auto}
.raceoutline .type table{ width:100%; margin-bottom:5.0rem;}
.raceoutline .type thead td{ text-align: center; background-color: #fbb03b; color: #ffffff; padding:0.5rem 0;font-size:1.6rem; font-weight: bold; border:1px solid #cccccc; }
.raceoutline .type tbody th{font-size:1.6rem; font-weight: bold; padding:1.5rem; border:1px solid #cccccc;}
.raceoutline .type tbody td{ padding:1.5rem 0.5rem; text-align: center; border:1px solid #cccccc; font-size: 1.6rem; vertical-align: middle;}
.raceoutline .type tbody td small{ display: block; font-size:1.1rem;}
.raceoutline h4{ font-size:2.0rem; font-weight: bold; display: flex; white-space: nowrap; align-items: center; margin-bottom:1.5rem;}
.raceoutline h4 i{ font-size:1.6rem; margin:0 0.5rem}
.raceoutline h4:after{ content: ''; width:100%; height:2px; background-color: #fbb03b; display: block;}
.access { padding-bottom:7.5rem; }
.access .block{ width:95%; max-width:1100px; margin:0 auto; display: flex;}
.access .block iframe{ display: block; width:50%; height:42.0rem}
.access h2{ margin-bottom:2.5rem}
.access .block .box{ width:calc(50% - 5.0rem); padding:2.5rem}
.access .block .box p{font-size:1.8rem; font-weight: bold; text-align: center; margin-bottom:2.5rem}
.access .block .box li{ display: flex; font-size:1.6rem; align-items: center; margin:1.5rem 0}
.access .block .box i{ color:#ffffff; min-width:5.0rem; min-height:5.0rem; display: flex; justify-content: center; align-items: center; border-radius: 50%; background-color: #fbb03b; font-weight: bold; margin-right:1.5rem}
section.entry{ display: flex; position: relative; justify-content: center; align-items: center; height:50vh; min-height:50rem}
section.entry figure{ width:100%; height:100%; position: absolute; clip-path: polygon(0 0, 100% 7.5%, 100% 100%, 0 92.5%); z-index: 2;}
section.entry figure img{ width:100%; height:100%; display: block; object-fit: cover; object-position: center;}
section.entry .block{ width:calc(90% - 10.0rem); max-width:900px; margin:0 auto; position: relative; z-index: 4; padding:5.0rem; background-color:rgba(0,0,0,0.5);}
section.entry .block h2{ color: #ffffff; font-size: 6.4rem; font-weight: 900;}
section.entry .block .description{ color: #ffffff; font-size:1.8rem;}
section.entry .block .button a{ display: flex; padding:1.5rem; font-size: 1.8rem; color: #ffffff; border-radius:1.0rem; justify-content: center; align-items: center; margin:1.5rem; font-weight: bold; border:2px solid #ffffff}
section.entry .block .button a:hover{ background-color: #000000;}
section.entry:before{ content:''; display: block; width:100%; height:100%; background-color:#fbb03b; position: absolute; clip-path: polygon(0 0, 100% 5%, 100% 100%, 0 95%); z-index: 1;}
section.entry:after{ content:''; display: block; width:100%; height:100%; background-color:#f7931e; position: absolute; clip-path: polygon(0 2.5%, 100% 0, 100% 97.5%, 0 100%); z-index: 0;}
section.contact{ padding:7.5rem 0}
section.contact h2{ margin-bottom:2.5rem;}
section.contact .mailform{ width:95%; max-width: 900px; margin:0 auto;}
section.contact table{ width:100%}
section.contact th{ font-size:1.6rem; font-weight: bold; padding:1.5rem 1.5rem; vertical-align: middle; border-bottom:1px solid #cccccc}
section.contact td{ padding: 1.5rem; font-size:1.6rem; border-bottom:1px solid #cccccc}
section.contact td input,
section.contact td select,
section.contact td textarea{ padding:0.75rem; width:calc( 100% - 1.5rem - 2px)}
section.contact .note{ font-size:1.3rem; padding:2.5rem}
section.contact .note i{ font-weight: bold; display: block;}
section.contact .doui{ text-align: center; font-size:1.6rem}
section.contact .doui input{ transform: scale(1.5);}
section.contact .submit{ display: flex; flex-direction: column; padding:2.5rem 0; align-items: center;}
section.contact .submit input{ width:30.0rem; padding:1.5rem 0; background-color: #fbb03b; color: #ffffff; font-weight: bold; border:none; border-radius:0.5rem;}
section.contact .submit input:disabled{ background-color: #cccccc;}

/*記事アーカイブ*/
.archivecontent header{ padding:5.0rem 0 0 0; display: flex; justify-content: center;}
.archivecontent header h2{ text-align: center;}
.archivecontent ul{ margin:0 auto}

/*記事個別ページ*/
.single .postcontent{ padding:5.0rem 0;}
.single .postcontent h1{ font-size:3.2rem; width:95%; text-align: center; margin:0 auto 2.5rem auto; font-weight: bold;}
.single .postcontent .main-eyecatch{width:95%; max-width:800px; margin:0 auto 2.5rem auto;}
.single .postcontent .main-eyecatch img{ width:100%; display: block; height: auto;}
.single .postcontent .post-data{ width:85%; max-width:750px; margin:0 auto 2.5rem auto; display: flex;}
.single .postcontent .post-data .date{ font-size:1.4rem; display: flex; align-items: center; white-space: nowrap; width:100%; font-weight: bold;}
.single .postcontent .post-data .date:after{ content:''; width:100%; height:1px; background-color:#666666; display: block; margin:0 0 0 0.5rem}
.single .postcontent .post-text{ font-size:1.6rem; width:85%; max-width:750px; margin:0 auto 2.5rem auto; line-height: 2; padding:0 0 2.5rem 0; border-bottom:1px solid #666666}
.single .postcontent .button{ text-align: center;}
.single .postcontent .button a{font-size:1.6rem; width:20.0rem; padding:1.5rem; background-color: #fbb03b; color: #ffffff; font-weight: bold; border:none; border-radius:0.5rem; display: block; margin:0 auto}
.single .postcontent .button a:hover{ background-color: #000000;}


/*404*/
.error-404 { padding:10.0rem 0}
.error-404 h1{ text-align: center; font-size: 3.2rem; color: #755b40;}

/*==============================================
●PC版非表示
===============================================*/
.sp{ display:none!important;}







/*===============================================
●レスポンシブ  画面の横幅が1210pxまで
===============================================*/
@media screen and (max-width:1210px){
}



/*===============================================
●レスポンシブ  画面の横幅が1040pxまで
===============================================*/
@media screen and (max-width:1040px){
html{font-size:1vw;}
  

}

/*===============================================
●レスポンシブ  画面の横幅が800pxまで
===============================================*/
@media screen and (max-width:800px){
}







/*===============================================
●レスポンシブ  画面の横幅が600pxまで
===============================================*/
@media screen and (max-width:600px){
body{ min-width:320px; background-image:none;}
img{
max-width: 100%;
height: auto;
width /***/:auto;
}
html{ font-size:2.0vw}
.pc{ display:none!important;}
.sp{ display:block!important;}
header{ height:auto}
header .logo{ width:66%; margin:0 auto; padding:2.5rem 0}
.eyecatch .text .wrap{ margin:0 auto}
section{ overflow: hidden;}
.eyecatch{ justify-content: center;}
.eyecatch .text{ width:100%;}
.eyecatch .text h1{ font-size: 3.6rem;}
.information .block{ flex-direction: column; justify-content: center;}
.information .ec{ margin:0 auto}
.information ul{ width:100%;}
.raceoutline .data td strong a{ display: inline-block;}
.access .block{ flex-direction: column; align-items: center;}
.access .block .box{ width:calc(100% - 5.0rem);}
.access .block iframe{ width:100%;}
section.entry .block h2{ font-size:4.8rem}
}




/*　ハンバーガーボタン　*/
.hamburger {
background-color: #ffffff;
display : block;
position: fixed;
z-index : 3000;
right : 0;
top   : 0;
width : 42px;
height: 42px;
cursor: pointer;
text-align: center;
}
.hamburger span {
display : block;
position: absolute;
width   : 30px;
height  : 3px ;
left    : 6px;
background : #070030;
-webkit-transition: 0.3s ease-in-out;
-moz-transition   : 0.3s ease-in-out;
transition        : 0.3s ease-in-out;
}
.hamburger span:nth-child(1) {
top: 10px;
}
.hamburger span:nth-child(2) {
top: 20px;
}
.hamburger span:nth-child(3) {
top: 30px;
}

/* ナビ開いてる時のボタン */
.hamburger.active span:nth-child(1) {
top : 20px;
left: 6px;
-webkit-transform: rotate(-45deg);
-moz-transform   : rotate(-45deg);
transform        : rotate(-45deg);
}  
.hamburger.active span:nth-child(2),
.hamburger.active span:nth-child(3) {
top: 20px;
-webkit-transform: rotate(45deg);
-moz-transform   : rotate(45deg);
transform        : rotate(45deg);
}
nav.globalMenuSp {
position: fixed;
z-index : 2999;
top  : 0;
left : 0;
color: #070030;
background: rgba(255, 255, 255, 0.95);
text-align: center;
transform: translateY(-100%);
transition: all 0.6s;
width: 100%;
}
/* このクラスを、jQueryで付与・削除する */
nav.globalMenuSp.active {
transform: translateY(0%);
height: 110vh;
}
/*メニューレイアウト*/
.globalMenuSp .wrap{ z-index:99999; overflow: scroll; position: relative; -webkit-overflow-scrolling: touch; display: flex; justify-content: center;}
.globalMenuSp .block{ height: 100vh;}
.globalMenuSp .branding{ width:28.0rem; margin:0 auto; padding:5.0rem 0}
.globalMenuSp ul{ text-align: left;}
.globalMenuSp li{ border-bottom: 1px solid #666666;}
.globalMenuSp li a{ font-size:2.4rem; font-weight: bold; padding:1.5rem 0; display: block;}
.globalMenuSp li:last-child img{ width:55%; height:55%}