@charset "UTF-8";



#gt{
margin:80px auto 30px;
display:flex;
flex-wrap:wrap;
align-items:center;
justify-content:center;
padding:0.5em;
border:#CCC dotted 2px;
text-align:center;
background-color:#FEFAEF;
}

#gt div{
flex:0 0 100%;
text-indent:0;
font-size:100%;
}

.text-cont div:first-child{
color:#F36;
font-weight:700;
}



/* Google Translate
------------------------------- */
.google-translate{
margin:0.5em auto;
text-align:center;
font-size:120%;
}

.google-translate a{
position:relative;
display:block;
width:70%;
text-align:center;
margin:5px auto;
padding:1em 2.5em 1em 2.5em;
color:#333;
text-shadow: 1px 1px 2px #FFF;
background-image:-moz-linear-gradient(50% 0% -90deg,rgb(236,236,251) 0%,rgb(202,202,217) 100%); 
background-image:-webkit-gradient(linear,50% 0%,50% 100%,color-stop(0, rgb(236,236,251)),color-stop(1, rgb(202,202,217)));
background-image:-webkit-linear-gradient(-90deg,rgb(236,236,251) 0%,rgb(202,202,217) 100%);
background-image:linear-gradient(180deg,rgb(236,236,251) 0%,rgb(202,202,217) 100%);
border:rgb(202,202,217) solid 1px;
font-weight:700;
text-decoration:none;

-webkit-border-radius:5px; 
-moz-border-radius:5px;
border-radius:5px;
}

.google-translate a:hover{
position:relative;
left:1px;
top:1px;
}


.google-translate a span.bm:before{
font-size:120%;
color:#003399;
line-height:1;
}

.google-translate a span.am:after{
font-size:120%;
color:#F60;
line-height:1;
}



#catch-col{
margin:30px auto 30px;
text-align:center;
}

#catch-col p{
font-size:200%;
line-height:2;
}


.top-message{
margin:1em auto;
padding:0.5em;
background-color:#FFF9F0;
font-size:120%;
}

#communitycafe h3 {
position: relative;
padding: 0.5em 0.5em 0.5em 2em;
color: #ff6a6a;
border-top: dotted 1px gray;
border-bottom: dotted 1px gray;
background: #fffff4;
font-size:140%;
line-height:1.4;
}

#communitycafe h3:before {
content: "\f138";
color: #ff6a6a;
font-size:140%;
}


dl.goal{
margin:1em 0;
padding:1em;
font-size:140%;
background-color:#F2FAEF;
border-radius:10px;
-webkit-border-radius:10px;
-moz-border-radius:10px;
}

dl.goal dt{
font-weight:700;
margin-bottom:0.5em;
font-size:140%;
}

dl.goal dt:before{
padding-right:0.5em;
content:'\f118';
font-family:FontAwesome;
font-style:normal;
font-weight:normal;
font-size:24px;
color:#67C065;
line-height:1;
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;
}

dl.goal dd{
margin-bottom:2em;	
margin-left:1.5em;
}


dl.goal dd ol li{
margin-left:1em;
text-indent:-1.5em;
padding:0.5em;
}

dl.goal dd ol li:before{
padding-right:0.5em;
content:'\f046';
font-family:FontAwesome;
font-style:normal;
font-weight:normal;
font-size:20px;
color:#FF6699;
line-height:1;
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;
}



figure{
margin:1em auto;
}

figure img{
border:#CCC solid 1px;
}

figcaption{
padding:0.5em;
}


/* .photo-col
------------------------------- */
.photo-col{
display:flex;
justify-content:center;
margin:1em auto;
text-align:center;
}

.photo-col figure{
max-width:100%;
height:auto;
margin:3%;
}

.photo-col .p2 figure{
flex:1;
max-width:360px;
height:auto;
}




dl.timetable{
margin:1em auto;
padding:1em;
}

dl.timetable dt {
padding:5px 0 5px 5px;
font-weight:700;
background-color:#EBEBEB;
}

dl.timetable dd {
padding:5px 0 0 5px;
margin-bottom:20px;
}




.cont-col{
margin:1em auto;
text-align:center;
padding:1em;
background-color:#FEFBEF;
border:#F5E7A0 solid 1px;
}

.cont-col .figure-col{
margin:0 auto;
padding:0;
text-align:center;
}

.cont-col .figure-co figure{
margin:0 auto;
padding:0.5em;
text-align:center;
}



.text-col p{
text-align:left;
text-indent:0;
}



/* お問合せ
------------------------- */
.contact-col{
margin:0.5em;
display:flex;
flex-direction:column;
justify-content:center;
align-items:stretch;
}

.method{
width:90%;
margin:0.5em;
padding:1em;
border:#CCC solid 1px;
background-color:#FFF;
text-align:center;
flex:1;
}

.link-b a{
display:block;
position:relative;
max-width:260px;
margin:0.5em auto;
padding:1.5em 1em;
color:#FFF;
-webkit-border-radius:4px;
-moz-border-radius:4px;
border-radius:4px;
text-decoration:none;
text-align:center;
}


.link-b.mail a{
background-color:#FF9900;
}

.link-b.line a{
background-color:#00B900;
}


.link-b a:hover{
position:relative;
top:1px;
left:1px;
}





.link-b.mail a::before {
position:absolute;
top:25%;
left:0.5em;
content:'\f0e0';
font-family:FontAwesome;
font-style:normal;
font-weight:normal;
font-size:26px;
color:#FFF;
line-height:1;
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;
}


.link-b.line a::before {
position:absolute;
top:20%;
left:0.7em;
content: '';
display:inline-block;
width:36px;
height:35px;
background-image:url(../images/community-cafe/icon-line.png);
background-size:contain;
vertical-align:middle;
}



.link-b a::after {
position:absolute;
top:25%;
right:0.3em;
content:'\f0da';
font-family:FontAwesome;
font-style:normal;
font-weight:normal;
font-size:26px;
color:#FFF;
line-height:1;
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;
}





@media all and (min-width:700px) {
	
	
	
#gt{
max-width:700px;
margin:30px auto 0;
padding:0.5em;
}

#gt div{
font-size:140%;
}



	
	
#catch-col{
margin:80px auto 50px;
}

#catch-col p{
font-size:200%;
line-height:2;
}


/* .photo-col
------------------------------- */

.photo-col figure{
flex:1;
max-width:700px;
height:auto;
}



dl.timetable{
width:90%;
font-size:120%;
}

dl.timetable dt{
clear:left;
width:15%;
float:left;
padding:10px 0 10px 0;
background-color:#FFF;
margin:0;
}

dl.timetable dd {
float:left;
width:75%;
border-left:3px #FF9966 solid;
padding:10px 0 10px 30px;
margin:0;
}




.cont-col{
display:flex;
}

.cont-col div{
flex:1;
}

.text-col{
padding:1em;
}

.text-col p{
margin-top:0;
line-height:2;
}


/* お問合せ
------------------------- */
.contact-col{
flex-direction:row;
}

.method{
flex:1;
max-width:40%;
margin:1em;
}


}




@media all and (min-width:960px) {


/* お問合せ
------------------------- */
.method{
max-width:360px;
}

}