@charset "utf-8";

@media screen and (min-width: 0px) and (max-width: 700px) {

.main_box_wrapper {
display: flex;
flex-flow: column nowrap;
align-items: center;
justify-content: center;
width: 100%;
margin: 2rem 0;
text-align: center; 
}

.main_box_1 {
display: flex;
flex-flow: row nowrap;
align-items: center;
justify-content: space-evenly;
width: 100%;
}

.main_box_2 {
display: flex;
flex-flow: row nowrap;
align-items: center;
justify-content: center;
width: 100%;
padding: 3% 0;
box-sizing: border-box;
z-index: 10;
}

.main_box_2 img {
width: 40%;
}

/* mo-吹き出し左上(始) *//* mo-吹き出し左上(始) */
.balloon_hidari_ue {
display: flex;
flex-flow: column nowrap;
align-items: center;
justify-content: center;
width: 45%;
height: 10rem;
position: relative;
background-color: #00A2F2;
color: #FFFFFE;
border-radius: 10px;
}
/* 色付きの半円 */
.balloon_hidari_ue::before {
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
border-radius: 50%;
transform: rotate(45deg);
right: 15%;
bottom: -35px;
border-left: 50px solid transparent;
border-top: 50px solid transparent;
border-right: 50px solid #00A2F2;
border-bottom: 50px solid #00A2F2;
}
/* 白い半円 */
.balloon_hidari_ue::after {
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
border-radius: 50%;
transform: rotate(45deg);
right: 5%;
bottom: -50px;
border-left: 50px solid transparent;
border-top: 50px solid transparent;
border-right: 50px solid #FFFFFE;
border-bottom: 50px solid #FFFFFE;
}
/* mo-吹き出し左上(終) *//* mo-吹き出し左上(終) */

/* mo-吹き出し右上(始) *//* mo-吹き出し右上(始) */
.balloon_migi_ue {
display: flex;
flex-flow: column nowrap;
align-items: center;
justify-content: center;
width: 45%;
height: 10rem;
position: relative;
background-color: #00A2F2;
color: #FFFFFE;
border-radius: 10px;
}
/* 色付きの半円 */
.balloon_migi_ue::before {
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
border-radius: 50%;
transform: rotate(45deg);
left: 15%;
bottom: -35px;
border-left: 50px solid transparent;
border-top: 50px solid transparent;
border-right: 50px solid #00A2F2;
border-bottom: 50px solid #00A2F2;
}
/* 白い半円 */
.balloon_migi_ue::after {
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
border-radius: 50%;
transform: rotate(45deg);
left: 5%;
bottom: -50px;
border-left: 50px solid transparent;
border-top: 50px solid transparent;
border-right: 50px solid #FFFFFE;
border-bottom: 50px solid #FFFFFE;
}
/* mo-吹き出し右上(終) *//* mo-吹き出し右上(終) */

/* mo-吹き出し左下(始) *//* mo-吹き出し左下(始) */
/* 吹き出し本体 */
.balloon_hidari_shita {
display: flex;
flex-flow: column nowrap;
align-items: center;
justify-content: center;
width: 45%;
height: 10rem;
position: relative;
background-color: #00A2F2;
color: #FFFFFE;
border-radius: 10px;
}
/* 色付きの半円 */
.balloon_hidari_shita::before {
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
border-radius: 50%;
transform: rotate(45deg);
right: 15%;
top: -35px;
border-left: 50px solid #00A2F2;
border-top: 50px solid #00A2F2;
border-right: 50px solid transparent;
border-bottom: 50px solid transparent;
}
/* 白い半円 */
.balloon_hidari_shita::after {
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
border-radius: 50%;
transform: rotate(45deg);
right: 5%;
top: -50px;
border-left: 50px solid #FFFFFE;
border-top: 50px solid #FFFFFE;
border-right: 50px solid transparent;
border-bottom: 50px solid transparent;
}
/* mo-吹き出し左下(終) *//* mo-吹き出し左下(終) */

/* mo-吹き出し右下(始) *//* mo-吹き出し左下(終) */
/* 吹き出し本体 */
.balloon_migi_shita {
display: flex;
flex-flow: column nowrap;
align-items: center;
justify-content: center;
width: 45%;
height: 10rem;
position: relative;
background-color: #00A2F2;
color: #FFFFFE;
border-radius: 10px;
}
/* 色付きの半円 */
.balloon_migi_shita::before {
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
border-radius: 50%;
transform: rotate(45deg);
left: 15%;
top: -35px;
border-left: 50px solid #00A2F2;
border-top: 50px solid #00A2F2;
border-right: 50px solid transparent;
border-bottom: 50px solid transparent;
}
/* 白い半円 */
.balloon_migi_shita::after {
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
border-radius: 50%;
transform: rotate(45deg);
left: 5%;
top: -50px;
border-left: 50px solid #FFFFFE;
border-top: 50px solid #FFFFFE;
border-right: 50px solid transparent;
border-bottom: 50px solid transparent;
}
/* mo-吹き出し右下(終) *//* mo-吹き出し右下(終) */

.box_inner_click {
background: rgba(0,0,0,0.15);
border-radius: 0px 0px 10px 10px;
}


}


@media screen and (min-width: 701px) { 

.main_box_wrapper {
display: flex;
flex-flow: column nowrap;
align-items: center;
justify-content: center;
width: 96%;
margin: 7em 0;
text-align: center; 
}

.main_box_1 {
display: flex;
flex-flow: row nowrap;
align-items: center;
justify-content: space-evenly;
width: 100%;
}

.main_box_2 {
display: flex;
flex-flow: row nowrap;
align-items: center;
justify-content: center;
width: 100%;
padding: 3% 0;
box-sizing: border-box;
z-index: 10;
}

.main_box_2 img {
width: 20%;
}

/* pc-吹き出し左上(始) *//* pc-吹き出し左上(始) */
.balloon_hidari_ue {
display: flex;
flex-flow: column nowrap;
align-items: center;
justify-content: center;
width: 35%;
height: 10rem;
position: relative;
background-color: #00A2F2;
color: #FFFFFE;
border-radius: 10px;
transition: 1s;
}
/* 色付きの半円 */
.balloon_hidari_ue::before {
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
border-radius: 50%;
transform: rotate(45deg);
right: 15%;
bottom: -45px;
border-left: 50px solid transparent;
border-top: 50px solid transparent;
border-right: 50px solid #00A2F2;
border-bottom: 50px solid #00A2F2;
}
/* 白い半円 */
.balloon_hidari_ue::after {
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
border-radius: 50%;
transform: rotate(45deg);
right: 5%;
bottom: -50px;
border-left: 50px solid transparent;
border-top: 50px solid transparent;
border-right: 50px solid #FFFFFE;
border-bottom: 50px solid #FFFFFE;
}

.balloon_hidari_ue:hover {
transform: scale(1.1,1.1);
transition: 0.3s;
}
/* pc-吹き出し左上(終) *//* pc-吹き出し左上(終) */

/* pc-吹き出し右上(始) *//* pc-吹き出し右上(始) */
.balloon_migi_ue {
display: flex;
flex-flow: column nowrap;
align-items: center;
justify-content: center;
width: 35%;
height: 10rem;
position: relative;
background-color: #00A2F2;
color: #FFFFFE;
border-radius: 10px;
transition: 1s;
}
/* 色付きの半円 */
.balloon_migi_ue::before {
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
border-radius: 50%;
transform: rotate(45deg);
left: 15%;
bottom: -45px;
border-left: 50px solid transparent;
border-top: 50px solid transparent;
border-right: 50px solid #00A2F2;
border-bottom: 50px solid #00A2F2;
}
/* 白い半円 */
.balloon_migi_ue::after {
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
border-radius: 50%;
transform: rotate(45deg);
left: 5%;
bottom: -50px;
border-left: 50px solid transparent;
border-top: 50px solid transparent;
border-right: 50px solid #FFFFFE;
border-bottom: 50px solid #FFFFFE;
}

.balloon_migi_ue:hover {
transform: scale(1.1,1.1);
transition: 0.3s;
}
/* pc-吹き出し右上(終) *//* pc-吹き出し右上(終) */

/* pc-吹き出し左下(始) *//* pc-吹き出し左下(始) */
.balloon_hidari_shita {
display: flex;
flex-flow: column nowrap;
align-items: center;
justify-content: center;
width: 35%;
height: 10rem;
position: relative;
background-color: #00A2F2;
color: #FFFFFE;
border-radius: 10px;
transition: 1s;
}
/* 色付きの半円 */
.balloon_hidari_shita::before {
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
border-radius: 50%;
transform: rotate(45deg);
right: 15%;
top: -45px;
border-left: 50px solid #00A2F2;
border-top: 50px solid #00A2F2;
border-right: 50px solid transparent;
border-bottom: 50px solid transparent;
}
/* 白い半円 */
.balloon_hidari_shita::after {
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
border-radius: 50%;
transform: rotate(45deg);
right: 5%;
top: -50px;
border-left: 50px solid #FFFFFE;
border-top: 50px solid #FFFFFE;
border-right: 50px solid transparent;
border-bottom: 50px solid transparent;
}

.balloon_hidari_shita:hover {
transform: scale(1.1,1.1);
transition: 0.3s;
}
/* pc-吹き出し左下(終) *//* pc-吹き出し左下(終) */

/* pc-吹き出し右下(始) *//* pc-吹き出し右下(始) */
/* 吹き出し本体 */
.balloon_migi_shita {
display: flex;
flex-flow: column nowrap;
align-items: center;
justify-content: center;
width: 35%;
height: 10rem;
position: relative;
background-color: #00A2F2;
color: #FFFFFE;
border-radius: 10px;
transition: 1s;
}
/* 色付きの半円 */
.balloon_migi_shita::before {
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
border-radius: 50%;
transform: rotate(45deg);
left: 15%;
top: -45px;
border-left: 50px solid #00A2F2;
border-top: 50px solid #00A2F2;
border-right: 50px solid transparent;
border-bottom: 50px solid transparent;
}
/* 白い半円 */
.balloon_migi_shita::after {
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
border-radius: 50%;
transform: rotate(45deg);
left: 5%;
top: -50px;
border-left: 50px solid #FFFFFE;
border-top: 50px solid #FFFFFE;
border-right: 50px solid transparent;
border-bottom: 50px solid transparent;
}

.balloon_migi_shita:hover {
transform: scale(1.1,1.1);
transition: 0.3s;
}
/* pc-吹き出し右下(終) *//* pc-吹き出し右下(終) */

.box_inner_click {
background: rgba(0,0,0,0.07);
border-radius: 0px 0px 	10px 10px;
}


}