/* Style for PCs */
@media screen and (min-width: 1025px) {

/* Guide top
------------------------------------------------------------*/
#guidetopm {
width:100%;
height: auto;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}
#guidetopm li {
width:31.2033333333333333333%;
height: auto;
display: block;
margin: 1%;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
#guidetopm li:nth-child(even) a {
background-color: #f9f9f9;
}
#guidetopm li:nth-child(odd) a {
background-color: #f4f4f4;
}
#guidetopm li a {
width:100%;
height: auto;
display: block;
text-decoration: none;
padding:25px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all  0.4s ease;
cursor:auto;
}

#guidetopm li a:hover {
/*background-color: #CADEEF;*/
}


.contact-btn{
	text-align: center;
	padding-top: 30px;

}

.contact-btn a{
    font-size: 14px;
    line-height: 50px;
    font-weight: 700;
    height: 50px;
    width: 40%;
    margin-right: auto;
    margin-left: auto;
    text-align: center;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    cursor: pointer;
    background-color: #011822;
    color: #fff;
    text-decoration: none;
    display: block;
}



#guidetopm li a img {
overflow: hidden;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
#guidetopm li a .gtm {
width:100%;
height: auto;
display: block;
padding:20px 5px;
}
#guidetopm li a .gtm h3 {
font-size:24px;
font-weight: 700;
line-height: 1.25em;
color:#222;
margin-bottom: 8px;
}
#guidetopm li a .gtm h4 {
font-size:0.7em;
font-weight: 400;
line-height: 1.4em;
color:#0A5BB0;
margin-bottom: 10px;
letter-spacing: 0px;
}
#guidetopm li a .gtm p.gtmcom {
width:auto;
height: auto;
display: block;
margin-bottom: 20px!important;
color:#444;
text-overflow: ellipsis;
overflow : hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}

#guidetopm li a .gtm p.gtmbn {
width:120px;
height: 20px;
display: block;
line-height: 20px;
font-size:0.8em;
letter-spacing: 0px;
text-align: center;
margin:0 auto!important;
color:#fff;
background-color: #011822;
-webkit-border-radius: 11px;
-moz-border-radius: 11px;
border-radius: 11px;
}
	
}


/* Style for iPad Pro */
@media screen and (min-width: 769px) and (max-width: 1024px) {

/* Guide top
------------------------------------------------------------*/
#guidetopm {
width:100%;
height: auto;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}
#guidetopm li {
width:47.80%;
height: auto;
display: block;
margin: 1%;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
#guidetopm li:nth-child(even) a {
background-color: #f9f9f9;
}
#guidetopm li:nth-child(odd) a {
background-color: #f4f4f4;
}
#guidetopm li a {
width:100%;
height: auto;
display: block;
text-decoration: none;
padding:25px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all  0.4s ease;
cursor:auto;
}
#guidetopm li a:hover {
/*background-color: #CADEEF;*/
}



.contact-btn{
	text-align: center;
	padding-top: 30px;

}

.contact-btn a{
    font-size: 14px;
    line-height: 50px;
    font-weight: 700;
    height: 50px;
    width: 40%;
    margin-right: auto;
    margin-left: auto;
    text-align: center;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    cursor: pointer;
    background-color: #011822;
    color: #fff;
    text-decoration: none;
    display: block;
}



#guidetopm li a img {
overflow: hidden;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
#guidetopm li a .gtm {
width:100%;
height: auto;
display: block;
padding:20px 5px;
}
#guidetopm li a .gtm h3 {
font-size:24px;
font-weight: 700;
line-height: 1.25em;
color:#222;
margin-bottom: 8px;
}
#guidetopm li a .gtm h4 {
font-size:0.7em;
font-weight: 400;
line-height: 1.4em;
color:#0A5BB0;
margin-bottom: 10px;
letter-spacing: 0px;
}
#guidetopm li a .gtm p.gtmcom {
width:auto;
height: auto;
display: block;
margin-bottom: 20px!important;
color:#444;
text-overflow: ellipsis;
overflow : hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}

#guidetopm li a .gtm p.gtmbn {
width:120px;
height: 20px;
display: block;
line-height: 20px;
font-size:0.8em;
letter-spacing: 0px;
text-align: center;
margin:0 auto!important;
color:#fff;
background-color: #011822;
-webkit-border-radius: 11px;
-moz-border-radius: 11px;
border-radius: 11px;
}

}

/* Style for iPad */
@media screen and (min-width: 481px) and (max-width: 768px) {

/* Guide top
------------------------------------------------------------*/
#guidetopm {
width:100%;
height: auto;
display: block;
}
#guidetopm li {
width:100%;
height: auto;
display: block;
margin-bottom: 20px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
#guidetopm li:nth-child(even) a {
background-color: #f9f9f9;
}
#guidetopm li:nth-child(odd) a {
background-color: #f4f4f4;
}
#guidetopm li a {
width:100%;
height: auto;
display: block;
text-decoration: none;
padding:25px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all  0.4s ease;
cursor: auto;
}
#guidetopm li a:hover {
/*background-color: #CADEEF;*/
}



.contact-btn{
	text-align: center;
	padding-top: 30px;

}

.contact-btn a{
    font-size: 14px;
    line-height: 50px;
    font-weight: 700;
    height: 50px;
    width: 60%;
    margin-right: auto;
    margin-left: auto;
    text-align: center;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    cursor: pointer;
    background-color: #011822;
    color: #fff;
    text-decoration: none;
    display: block;
}

#guidetopm li a img {
overflow: hidden;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
#guidetopm li a .gtm {
width:100%;
height: auto;
display: block;
padding:20px 5px;
}
#guidetopm li a .gtm h3 {
font-size:24px;
font-weight: 700;
line-height: 1.25em;
color:#222;
margin-bottom: 8px;
}
#guidetopm li a .gtm h3 br {
display: none;
}
#guidetopm li a .gtm h4 {
font-size:0.7em;
font-weight: 400;
line-height: 1.4em;
color:#0A5BB0;
margin-bottom: 10px;
letter-spacing: 0px;
}
#guidetopm li a .gtm p.gtmcom {
width:auto;
height: auto;
display: block;
margin-bottom: 20px!important;
color:#444;
text-overflow: ellipsis;
overflow : hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}

#guidetopm li a .gtm p.gtmbn {
width:120px;
height: 20px;
display: block;
line-height: 20px;
font-size:0.8em;
letter-spacing: 0px;
text-align: center;
margin:0 auto!important;
color:#fff;
background-color: #011822;
-webkit-border-radius: 11px;
-moz-border-radius: 11px;
border-radius: 11px;
}

}

/* Style for Smartphone */
@media screen and (max-width: 480px) {

/* Guide top
------------------------------------------------------------*/
#guidetopm {
width:100%;
height: auto;
display: block;
}
#guidetopm li {
width:100%;
height: auto;
display: block;
margin-bottom: 20px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
#guidetopm li:nth-child(even) a {
background-color: #f9f9f9;
}
#guidetopm li:nth-child(odd) a {
background-color: #f4f4f4;
}
#guidetopm li a {
width:100%;
height: auto;
display: block;
text-decoration: none;
padding:25px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all  0.4s ease;
cursor: auto;
}
#guidetopm li a:hover {
/*background-color: #CADEEF;*/
}


.contact-btn{
	text-align: center;
	padding-top: 30px;

}

.contact-btn a{
    font-size: 14px;
    line-height: 50px;
    font-weight: 700;
    height: 50px;
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    text-align: center;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    cursor: pointer;
    background-color: #011822;
    color: #fff;
    text-decoration: none;
    display: block;
}


#guidetopm li a img {
overflow: hidden;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
#guidetopm li a .gtm {
width:100%;
height: auto;
display: block;
padding:20px 5px;
}
#guidetopm li a .gtm h3 {
font-size:24px;
font-weight: 700;
line-height: 1.25em;
color:#222;
margin-bottom: 8px;
}
#guidetopm li a .gtm h3 br {
display: none;
}
#guidetopm li a .gtm h4 {
font-size:0.7em;
font-weight: 400;
line-height: 1.4em;
color:#0A5BB0;
margin-bottom: 10px;
letter-spacing: 0px;
}
#guidetopm li a .gtm p.gtmcom {
width:auto;
height: auto;
display: block;
margin-bottom: 20px!important;
color:#444;
text-overflow: ellipsis;
overflow : hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}

#guidetopm li a .gtm p.gtmbn {
width:120px;
height: 20px;
display: block;
line-height: 20px;
font-size:0.8em;
letter-spacing: 0px;
text-align: center;
margin:0 auto!important;
color:#fff;
background-color: #011822;
-webkit-border-radius: 11px;
-moz-border-radius: 11px;
border-radius: 11px;
}

}