@charset "utf-8";
@media screen and (min-width: 1201px) { html{font-size:16px; } }@media screen and (max-width: 1200px) { html{font-size:15px; } }@media screen and (max-width: 1024px) { html{font-size:14px; } }@media screen and (max-width: 768px) {  html{font-size:13px; } }@media screen and (max-width: 480px) {  html{font-size:12px; } }a,a:visited,a:active { color:rgba(86,184,199,1.00)}a:hover { color:rgba(245,114,10,1.00)}
/* css setting */
/* header {
    border-bottom: 1px solid #009FE8;
}
 */


#pt002-1Parent , #pt002-2Parent , #pt002-3Parent ,#pt002-4Parent , #pt002-5Parent {
    background: rgba(255,255,255,0.85);
}

a   {
text-decoration:none;
}

h1 , h2 , h3 {
    margin: 0px 0px 0px 0px;
    padding: 0px 0px;
    margin-top: 0px;
}

.hover_opacity:hover{
    opacity: 0.8;
    transition:0.6s;
}

.hover_opacity_img img:hover { 
opacity:0.6; 
transition:0.6s;
}



/* -------------------------------------------------- エントリーボタン --------------------------------------------------*/ 

#bottomfix {
    position: fixed;
    z-index: 100;
    bottom: 0;
    right: 0;
} 

#topfix_A {
    position: fixed;
    z-index: 10;
    top: 0;
    right: 0;
}




/*　--------------------　オートナビ　--------------------　*/

/* #navi .fsNavMenuList li:first-child {
display:none;
} */

#navi .fsNavMenuList li {
    background: rgba(255,255,255,0.8);
}


#header-4-1 .fsNavMenuList li {
    border-radius: 2rem;
}



/*　--------------------　Fatナビ　--------------------　*/

.fat-nav li {
    list-style-type: none;
    text-align: center;
    padding: 1.5rem;
    font-size: 1.3em;
    border-bottom: 1px solid white;
}

.fat-nav{
    background:#56B8C7
}

.hamburger .hamburger__icon, .hamburger .hamburger__icon:before, .hamburger .hamburger__icon:after {
    background-color: #56B8C7;
}

.hamburger{
position: absolute;
top: 2rem;
right: 1rem;
float: right;
padding-bottom: 2.4rem;
border: 1px solid #56B8C7;
background-color: white;
}

.hamburger.active .hamburger__icon:after, .hamburger.active .hamburger__icon:before {
    background-color: #56B8C7;
}



/* -------------------------------------------------- 文字関係 -------------------------------------------------- */

.writing-mode {
    -ms-writing-mode: tb-rl;
    -webkit-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
}


.eiji{
font-family: Century Gothic , Futura-Medium , Gill Sans , メイリオ , Meiryo ,sans-serif;
}

.impact {
font-family:  Impact , Haettenschweiler , Helvetica Neue , Helvetica , arial , メイリオ , Meiryo ,sans-serif;
}

.bold {
    font-weight: bold;
}

.space {
    letter-spacing: 0.1rem;
}

.space_2 {
    letter-spacing: 0.2rem;
}

.space_3 {
    letter-spacing: 0.3rem;
}


/*　--------------------　スクロールリスト　--------------------

.fs-scroll a, .fs-scroll a:visited, .fs-scroll a:active {
     color: #ffffff;
}

.fs-scroll a:hover {
     color: #BBD1E9;
}

　*/

/*　--------------------　パンくず色　--------------------　*/

.fs_breadcrumb, .fs_breadcrumb a, .fs_breadcrumb a:visited, .fs_breadcrumb  a:active {
      color: #ffffff;
}

.fs_breadcrumb a:hover {
      color: #ffffff;
      text-decoration: underline;
}


/* -------------------------------------------------- 色関係 -------------------------------------------------- */


.main_color {
    color: #56b8c7;
}

.main_border-left_color {
    border-left:1px solid #ec6500;
}
.main_border-top_color {
    border-top:1px solid #ec6500;
}

/*コンテンツタイトルの背景色*/


.white_rgba {
    background-color: rgba(255,255,255,0.85);
}

.yellow_rgba {
    background-color: rgba(237,232,66,0.85);
}

.orange_rgba {
    background-color: rgba(255,182,7,0.45);
}

.green_rgba {
    background-color: rgba(56,131,60,0.65);
}

.blue_rgba {
    background-color: rgba(4,147,196,0.85);
}

.pink_rgba {
    background-color: rgba(255,141,172,0.75);
}

.black_rgba {
    background-color: rgba(25,25,30,0.75);
}

.gray_rgba {
    background-color: rgba(46,54,66,0.85);
}

/* --------------------------------------------------　ボタン　-------------------------------------------------- */

.fs_btn {
    background: none;
}

.fs_btn {
line-height: 1.5rem;
}


/* -------------------- マルチイメージのポインター変更無 -------------------- */

.cuosor {
  pointer-events: none ;
  cursor: default ;
}

/* -------------------- ホバー時拡大 -------------------- */

.transform img:hover{ 
  transition: 2.0s;
  -webkit-transform: scale(1.05); 
  -moz-transform: scale(1.05); 
  -ms-transform: scale(1.05); 
  -o-transform: scale(1.05); 
  transform: scale(1.05); 
}

.overflow {
  overflow: hidden;
}

/* -------------------- ホバー時ボーダーボトム -------------------- */

.hover_line {
	position: relative;
	display: inline-block;
	transition: 0.5s;
}

.hover_line::before,
.hover_line::after {
	position: absolute;
	content: '';
	width: 0;
	height: 1px;
	background-color: #f00000;
	transition: 0.5s;
}

.hover_line::before {
	top: 0;
	left: 0;
}
.hover_line::after {
	bottom: 0;
	right: 0;
}
.hover_line:hover::before,
.hover_line:hover::after {
	width: 100%;
}





/* -------------------------------------------------- コンポーザー・ページリスト関係 -------------------------------------------------- */


/*#fsInfoBlock .entryTitle {
  font-weight: bold;
}*/

.news .entryData:after{
    background: #c8c8c8 !important;
    font-size: 0.8rem !important;
    color: #ffffff !important;
    margin-left: 0.2rem !important;
}

#pt101-2-1 .fs_c_title , #pt102-2-1 .fs_c_title , #pt103-2-1 .fs_c_title , #pt104-2-1 .fs_c_title {
  background-repeat: no-repeat;
  margin: 0 2rem 0 2rem;
  padding: 2rem 0 2rem 0;
  font-size: 1.2rem;
  color: #0493c4 ;
  text-align: justify;
}

#pt101-2-1 .fs_content , #pt102-2-1 .fs_content , #pt103-2-1 .fs_content , #pt104-2-1 .fs_content {
  background-repeat: no-repeat;
  padding: 2rem 0 4rem 0;
  margin: 0 2rem 0 2rem;
  border-top: 1px solid #edf0f0;
  font-size: 1rem;
  text-align: justify;
}

#fsInfoBpager .numbers {
    font-family: Century Gothic , Futura-Medium , メイリオ , Meiryo ,sans-serif;
    background: #c8c8c8 ;
}

#fsInfoBpager .active {
    font-family: Century Gothic , Futura-Medium , メイリオ , Meiryo ,sans-serif;
    background: #969696 ;
}

#fsInfoBpager .ccm-page-left a,
#fsInfoBpager .ccm-page-right a {
    background: #c8c8c8 ;
}

#fsInfoBpager .ccm-page-left span,
#fsInfoBpager .ccm-page-right span{
    background: #969696 ;
}

div.cal_wrapper table.cal tr td div.Birthday {
    font-weight: bolder;
    background-color: #e8e8e8;
    color: #0493c4;
    border-radius: 0px;
}


/*　--------------------　ギャラリーブロック　--------------------　 */
/* -----20200207 調整のためコメントアウト----- */
/*#imageLightbox-container li {
    display: inline-block;
    margin: 0.5rem;
}


#imageLightbox-container img {
   border: 2px solid rgba( 255, 255, 255, .5 );
}

#imageLightbox-container img:hover {
   border-color: #00b7cf;
   box-shadow: 0 0 0.25rem rgba( 0, 0, 0, .25 );
}*/


/* --------------------------------------------------　角丸　-------------------------------------------------- */

.border-radius {
    border-radius: 1rem;
}

.border-radius_under {
-ms-border-bottom-right-radius:1rem ;  
-ms-border-bottom-left-radius:1rem ;  
-moz-border-bottom-right-radius:1rem;   
-moz-border-bottom-left-radius:1rem;  
-webkit-border-bottom-right-radius:1rem;  
-webkit-border-bottom-left-radius:1rem;  
border-bottom-right-radius:1rem; 
border-bottom-left-radius:1rem;
}

.border-radius_top {
-ms-border-top-right-radius:1rem ;  
-ms-border-top-left-radius:1rem ;  
-moz-border-top-right-radius:1rem;   
-moz-border-top-left-radius:1rem;  
-webkit-border-top-right-radius:1rem;  
-webkit-border-top-left-radius:1rem;  
border-top-right-radius:1rem; 
border-top-left-radius:1rem;
}


/*　--------------------　bxスライダー　--------------------　*/

.bx-wrapper .bx-viewport {
    -moz-box-shadow: nonw;
    -webkit-box-shadow: none;
    box-shadow: none;
    border: none;
    left: 0;
    background: none;
    -webkit-transform: translatez(0);
    -moz-transform: translatez(0);
    -ms-transform: translatez(0);
    -o-transform: translatez(0);
    transform: translatez(0);
}



/*　--------------------　ボックスシャドウ　--------------------　*/

.box-shadow img {
    box-shadow: 0.1rem 0.1rem #cccccc;
    -webkit-box-shadow: 0.1rem 0.1rem #cccccc;
    -moz-box-shadow: 0.1rem 0.1rem #cccccc;
}

/*　--------------------　ギャラリーに関する設定　--------------------　*/
.gallery ul{
display: -webkit-flex!important;
display: -moz-flex!important;
display: -ms-flex!important;
display: -o-flex!important;
display: flex!important;
flex-flow: row wrap!important;
justify-content: flex-start!important;
align-contents: stretch!important;
}
.gallery li{
margin: 0%!important;
}
.gallery li:hover{
transition: .3s;
opacity: 0.4!important;
}
.gallery li a img{
width: 100%!important;
height: auto!important;
box-sizing: border-box!important;
/*border: 0px solid rgba( 60, 158, 143, 1 )!important;
box-shadow:0rem 0rem 0rem rgba( 0, 0, 0, .05 )!important;*/
}
@media screen and (max-width: 698px) {
.gallery li{
width: 16.66%!important;
}
}
@media screen and (max-width: 480px) {
.gallery li{
width: 33.33%!important;
}
}
/*----- 元のLightbox用設定を無効化 -----*/
#imageLightbox-container img {
border:none !important;
box-shadow:none !important;
transion:none !important;
}


/*----- Tシャツ用テーブル -----*/
#tshirt2020 {
margin-bottom: 1rem;
width:100%;
}
#tshirt2020 td {
border: 1px solid #CCC;
border-collapse: collapse;
padding:0.2rem 0.7rem;
text-align:center;
vertical-align:middle;
}
#tshirt2020 td.midashi {
background:#efefef;
}
.xscroll {
overflow:auto;
white-space:nowrap;
}
@media screen and (max-width: 480px) {
.xscroll {
width: 200px;
}
}

@media screen and (max-width: 480px) {
.home_feature {
 padding: 9rem 0 2rem 0;
}
.home_course {
 padding: 0 0 8rem 0;
}
.home_day {
 padding: 2rem 0 0 0;
}
}

@media screen and (max-width: 480px) {
.feature_number {
width: 16%;
display: block;
margin-left: auto;
 margin-right: auto ;
}
}

/* スマホの場合切り抜きキャンセル ここから */
@media screen and (max-width: 480px) {
.change_layout .ccm-layout-row .ccm-layout-cell svg image {
clip-path: none;/* svgの切り抜き止める */
}
}
/* スマホの場合切り抜きキャンセル ここまで */

/* スマホの場合左右入れ替え ここから */
@media screen and (max-width: 480px) {
.change_layout_center .ccm-layout-row {
display:flex;
flex-direction: column;/* 縦並び */
}
.change_layout_center .ccm-layout-row .ccm-layout-cell:nth-child(1) {
order: 2;
}
.change_layout_center .ccm-layout-row .ccm-layout-cell:nth-child(2) {
order: 1;
}
}
/* スマホの場合左右入れ替え ここまで */

.home_space_02 {
padding:18rem 0 0 0;
}

@media screen and (max-width: 1300px) {
.home_space_02 {
padding:7rem 0 0 0;
}
}

.home_space {
padding:13rem 0 0 0;
}

@media screen and (max-width: 1300px) {
.home_space {
padding: 5rem 0 0 0;
}
}


@media screen and (max-width: 1300px) {
#imageLightbox-container li {
width: 50%;
}
}

.home_feature_background {
background-image: url(https://work.fine-security.com/trial/tri_kakeroma_half/files/2117/5746/9839/home_tourism_bacground.png);
background-repeat: no-repeat;
background-position: right;
background-size:  cover;
background-color:#56B8C7;
}

@media only screen and (max-width: 920px) {
.home_feature_background {
background-image: url(https://work.fine-security.com/trial/tri_kakeroma_half/files/4017/5747/0121/home_tourism_bacground_ipad.png);
background-repeat: no-repeat;
background-position: right;
background-size:  cover;
background-color:#56B8C7;
}
}

@media screen and (max-width: 480px) {
.home_feature_background {
background-image:none;
background-color:#56B8C7;
}
}

@media screen and (max-width: 480px) {
#bottomfix {
    width: 100%;
}
}


.contents_top {
background-image: url(https://work.fine-security.com/trial/tri_kakeroma_half/files/6317/5696/2295/nami_background.png);
background-repeat: no-repeat;
background-position: top;
background-size: 100% auto;
}

@media only screen and (max-width: 1200px) {
.contents_top {
background-image: url(https://work.fine-security.com/trial/tri_kakeroma_half/index.php/download_file/593/);
background-repeat: no-repeat;
background-position: top;
background-size:  100% auto;
}
}

@media only screen and (max-width: 480px) {
.contents_top {
background-image: url(https://work.fine-security.com/trial/tri_kakeroma_half/files/2817/5730/6493/nami__mainvisual_sp.png);
background-repeat: no-repeat;
background-position: top;
background-size:  100% auto;
}
}

.gallery li {
    width: 25%;
}

@media screen and (min-width: 480px) {
.SP_text {
display:none;
}
}

@media screen and (max-width: 480px) {
.umore_text {
width: 69%;
display: block;
margin-left: auto;
margin-right: auto;
}
}

.half_marathon_logo {
width:44%;
display: block;
margin-left: auto;
margin-right: auto;
}

@media screen and (max-width: 1200px) {
.half_marathon_logo {
width:79%;
display: block;
margin-left: auto;
margin-right: auto;
margin-top: 0.5rem;
}
}

@media screen and (max-width: 480px) {
.half_marathon_logo {
width:19%;
display: block;
margin-left: auto;
margin-right: auto;
}
}

.half_marathon_white_logo {
width: 16%;
display: block;
margin-left: auto;
margin-right:auto;
}




@media screen and (max-width: 480px) {
.half_marathon_white_logo {
width:23%;
display: block;
margin-left: auto;
margin-right: auto;
}
}


.ferry_img {
padding-top:2rem;
}



.feature_text {
  font-style: italic;
letter-spacing: .1em;
color: #fff;
text-shadow: 2px 2px 5px rgb(245 114 10);
}

@media screen and (max-width: 480px) {
.feature_text {
font-style: italic;
letter-spacing: .1em;
color: #fff;
text-shadow: 2px 2px 5px rgb(245 114 10);
}
}


@media screen and (max-width: 2400px) { 
.home_main_margin {
margin: 0 1rem 0 1rem;
}
}


@media screen and (max-width: 1100px) {
.home_main_margin {
margin: 0 1rem 1rem 1rem;
}
}


.space-1{
letter-spacing: 0.1rem;
}
.space-2{
letter-spacing: 0.2rem;
}
.space-3{
letter-spacing: 0.3rem;
}
.space-4{
letter-spacing: 0.4rem;
}
.br-sp{
display:none;
}
.br-sp-r{
display:inline;
}
@media screen and (max-width: 1400px) { 
.br-sp{
display:block;
line-height:0rem;
}
}

@media screen and (max-width: 480px) { 
.tx-center{
text-align: center!important;
}
.tx-left{
text-align: left!important;
}
.tx-right{
text-align: right!important;
}
.br-sp{
display:block;
line-height:0rem;
}
.br-sp-r{
display:none;
}
}


@media screen and (max-width: 2400px) { 
.home_main_padding {
padding:4.5rem 0 0 0;
}
}

@media screen and (max-width: 1100px) {
.home_main_padding {
padding:2rem 0 0 0;
}
}